diff --git a/data/prefixes.js b/data/prefixes.js index e0d3c72bc..fa72d1ad8 100644 --- a/data/prefixes.js +++ b/data/prefixes.js @@ -583,7 +583,15 @@ f(prefixIntrinsic, browsers => ) f(prefixIntrinsic, { match: /x|\s#4/ }, browsers => - prefix(['fill', 'fill-available', 'stretch'], { + prefix(['fill', 'fill-available'], { + props: sizeProps, + feature: 'intrinsic-width', + browsers + }) +) + +f(prefixIntrinsic, { match: /x|\s#5/ }, browsers => + prefix(['stretch'], { props: sizeProps, feature: 'intrinsic-width', browsers diff --git a/test/autoprefixer.test.ts b/test/autoprefixer.test.ts index 4462e3f45..028b50e93 100644 --- a/test/autoprefixer.test.ts +++ b/test/autoprefixer.test.ts @@ -1047,4 +1047,14 @@ describe('hacks', () => { expect(result.css).toEqual(input) expect(result.warnings()).toHaveLength(0) }) + + it('supports latest Firefox stretch', () => { + let input = read('intrinsic') + let output = read('intrinsic.ff') + let result = postcss([ + autoprefixer({ overrideBrowserslist: 'firefox 90' }) + ]).process(input) + expect(result.css).toEqual(output) + expect(result.warnings()).toHaveLength(2) + }) }) diff --git a/test/cases/intrinsic.ff.css b/test/cases/intrinsic.ff.css new file mode 100644 index 000000000..71d9e5856 --- /dev/null +++ b/test/cases/intrinsic.ff.css @@ -0,0 +1,47 @@ +a { + width: -moz-available; + width: stretch; +} + +b { + height: max-content; +} + +p { + block-size: min-content; + min-inline-size: -moz-fit-content; + min-inline-size: fit-content; +} + +.outdated { + width: fill; +} + +.old { + width: fill-available; +} + +.ok { + width: calc(100% - var(--jqx-circular-progress-bar-fill-size)); +} + +.grid { + grid: min-content max-content / fit-content(500px); +} + +.grid-template { + grid-template: min-content / fit-content(10px) max-content; + grid-template: max-content 1fr max-content max-content / max-content 1fr; +} + +.grid-template-columns { + grid-template-columns: minmax(100px, min-content); +} + +.grid-auto-columns { + grid-auto-columns: min-content max-content; +} + +.ignore { + width: -webkit-fill-available; +}