From 9f99d8b02f5c7e0d8f26945d623c5941c58dd1d7 Mon Sep 17 00:00:00 2001 From: Jonathan Neal Date: Tue, 28 Apr 2020 06:59:51 -0400 Subject: [PATCH 01/12] 7.0.0 --- .gitattributes | 1 + .gitignore | 4 +- .rollup.js | 21 ++-- .travis.yml | 2 - CHANGELOG.md | 26 ++++ README.md | 6 +- package.json | 96 +++++++++------ src/cli.js | 3 +- src/lib/ids-by-execution-order.js | 1 - src/lib/plugins-by-id.js | 2 - test/basic.autoprefixer.expect.css | 7 +- test/basic.autoprefixer.false.expect.css | 7 +- test/basic.ch38.expect.css | 7 +- test/basic.css | 9 +- test/basic.expect.css | 145 ++++++++--------------- test/basic.ff49.expect.css | 7 +- test/basic.nesting.expect.css | 82 ++++--------- test/basic.stage0-ff49.expect.css | 7 +- test/basic.stage0.expect.css | 145 ++++++++--------------- test/import.expect.css | 12 +- 20 files changed, 238 insertions(+), 352 deletions(-) create mode 100644 .gitattributes diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 0000000..6313b56 --- /dev/null +++ b/.gitattributes @@ -0,0 +1 @@ +* text=auto eol=lf diff --git a/.gitignore b/.gitignore index 056c19f..5bd3ef6 100644 --- a/.gitignore +++ b/.gitignore @@ -1,12 +1,12 @@ +dist node_modules package-lock.json *.log* *.result.css .* !.editorconfig +!.gitattributes !.gitignore !.rollup.js !.tape.js !.travis.yml -/index.js* -/index.mjs* diff --git a/.rollup.js b/.rollup.js index 7df09c9..1fb0d87 100644 --- a/.rollup.js +++ b/.rollup.js @@ -1,16 +1,9 @@ -import babel from 'rollup-plugin-babel'; +import pkg from './package.json' export default { - input: 'src/postcss.js', - output: [ - { file: 'index.js', format: 'cjs', sourcemap: true }, - { file: 'index.mjs', format: 'esm', sourcemap: true } - ], - plugins: [ - babel({ - presets: [ - ['@babel/env', { targets: { node: 6 } }] - ] - }) - ] -}; + ...pkg.rollup, + plugins: pkg.rollup.plugins.map(plugin => require(plugin)()), + onwarn(warning, warn) { + if (warning.code !== 'UNRESOLVED_IMPORT') warn(warning) + } +} diff --git a/.travis.yml b/.travis.yml index 08a68cc..bb855a0 100644 --- a/.travis.yml +++ b/.travis.yml @@ -9,8 +9,6 @@ os: node_js: - 10 - - 8 - - 6 install: - git config --global core.autocrlf false diff --git a/CHANGELOG.md b/CHANGELOG.md index 05a6190..d6845ed 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,31 @@ # Changes to PostCSS Preset Env +### 7.0.0 (April 25, 2020) + +- Updated `autoprefixer` to 9.7.6 (minor) +- Updated `browserslist` to 4.12.0 (minor) +- Updated `caniuse-lite` to 1.0.30001048 (patch) +- Updated `css-blank-pseudo` to 1.0.0 (major) +- Updated `css-has-pseudo` to 1.0.0 (major) +- Updated `css-prefers-color-scheme` to 4.0.0 (major) +- Updated `cssdb` to 5.0.0 (major) +- Updated `postcss` to 7.0.27 (patch) +- Updated `postcss-attribute-case-insensitive` to 4.0.2 (patch) +- Updated `postcss-color-functional-notation` to 3.0.2 (major) +- Updated `postcss-color-hex-alpha` to 6.0.0 (major) +- Updated `postcss-color-rebeccapurple` to 6.0.0 (major) +- Updated `postcss-custom-properties` to 9.1.1 (major) +- Updated `postcss-env-function` to 3.0.0 (major) +- Updated `postcss-focus-visible` to 5.0.0 (major) +- Updated `postcss-focus-within` to 4.0.0 (major) +- Updated `postcss-initial` to 3.0.2 (patch) +- Updated `postcss-lab-function` to 3.1.2 (major) +- Updated `postcss-logical` to 4.0.2 (major) +- Updated `postcss-nesting` to 7.0.1 (patch) +- Updated `postcss-place` to 5.0.0 (major) +- Removed `postcss-color-gray` +- Updated support for Node 10+ (major) + ### 6.7.0 (July 8, 2019) - Fixed the issue of autoprefixer alerting an upcoming change to the API diff --git a/README.md b/README.md index fa93371..02d8a90 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ # PostCSS Preset Env [PostCSS][postcss] -[![NPM Version][npm-img]][npm-url] -[![Build Status][cli-img]][cli-url] -[![Support Chat][git-img]][git-url] +[npm version][npm-url] +[build status][cli-url] +[support chat][git-url] [PostCSS Preset Env] lets you convert modern CSS into something most browsers can understand, determining the polyfills you need based on your targeted diff --git a/package.json b/package.json index 32f66b7..19c597b 100644 --- a/package.json +++ b/package.json @@ -1,30 +1,29 @@ { "name": "postcss-preset-env", - "version": "6.7.0", + "version": "7.0.0", "description": "Convert modern CSS into something browsers understand", "author": "Jonathan Neal ", "license": "CC0-1.0", "repository": "csstools/postcss-preset-env", "homepage": "https://github.com/csstools/postcss-preset-env#readme", "bugs": "https://github.com/csstools/postcss-preset-env/issues", - "main": "index.js", - "module": "index.mjs", + "main": "dist/index.js", + "module": "dist/index.mjs", "files": [ - "index.js", - "index.js.map", - "index.mjs", - "index.mjs.map" + "dist" ], "scripts": { - "build": "rollup -c .rollup.js --silent", - "prepublishOnly": "npm test", - "pretest:tape": "npm run build", - "test": "npm run test:js && npm run test:tape", - "test:js": "eslint src/*.js src/lib/*.js src/patch/*.js --cache --ignore-path .gitignore --quiet", - "test:tape": "postcss-tape" + "build": "npx rollup -c .rollup.js", + "build:watch": "npx rollup -c .rollup.js --watch", + "lint": "npx eslint --cache src", + "lint:fix": "npx eslint --cache --fix", + "pretest": "npm install && npm run build", + "test": "npm run lint && npm run tape", + "tape": "npx postcss-tape", + "prepublishOnly": "npm test" }, "engines": { - "node": ">=6.0.0" + "node": ">=10.0.0" }, "dependencies": { "autoprefixer": "^9.6.1", @@ -40,47 +39,76 @@ "postcss-color-gray": "^5.0.0", "postcss-color-hex-alpha": "^5.0.3", "postcss-color-mod-function": "^3.0.3", - "postcss-color-rebeccapurple": "^4.0.1", + "postcss-color-rebeccapurple": "^6.0.0", "postcss-custom-media": "^7.0.8", - "postcss-custom-properties": "^8.0.11", + "postcss-custom-properties": "^9.1.1", "postcss-custom-selectors": "^5.1.2", "postcss-dir-pseudo-class": "^5.0.0", - "postcss-double-position-gradients": "^1.0.0", - "postcss-env-function": "^2.0.2", - "postcss-focus-visible": "^4.0.0", - "postcss-focus-within": "^3.0.0", + "postcss-double-position-gradients": "^2.0.0", + "postcss-env-function": "^3.0.0", + "postcss-focus-visible": "^5.0.0", + "postcss-focus-within": "^4.0.0", "postcss-font-variant": "^4.0.0", "postcss-gap-properties": "^2.0.0", "postcss-image-set-function": "^3.0.1", - "postcss-initial": "^3.0.1", - "postcss-lab-function": "^2.0.1", - "postcss-logical": "^3.0.0", + "postcss-initial": "^3.0.2", + "postcss-lab-function": "^3.1.2", + "postcss-logical": "^4.0.2", "postcss-media-minmax": "^4.0.0", - "postcss-nesting": "^7.0.0", + "postcss-nesting": "^7.0.1", "postcss-overflow-shorthand": "^2.0.0", "postcss-page-break": "^2.0.0", - "postcss-place": "^4.0.1", + "postcss-place": "^5.0.0", "postcss-pseudo-class-any-link": "^6.0.0", "postcss-replace-overflow-wrap": "^3.0.0", "postcss-selector-matches": "^4.0.0", "postcss-selector-not": "^4.0.0" }, "devDependencies": { - "@babel/core": "^7.5.0", - "@babel/preset-env": "^7.5.2", - "babel-eslint": "^10.0.2", - "eslint": "^5.16.0", - "eslint-config-dev": "^2.0.0", + "@babel/core": "^7.9.0", + "@babel/preset-env": "^7.9.5", + "babel-eslint": "^10.1.0", + "eslint": "^6.8.0", "postcss-simple-vars": "^5.0.2", - "postcss-tape": "^4.0.0", + "postcss-tape": "^5.0.2", "pre-commit": "^1.2.2", - "rollup": "^1.16.6", - "rollup-plugin-babel": "^4.3.3" + "rollup": "^2.7.3", + "rollup-plugin-babel": "^4.4.0" + }, + "babel": { + "presets": [ + [ + "@babel/env", + { + "targets": "maintained node versions" + } + ] + ] }, "eslintConfig": { - "extends": "dev", + "env": { + "es6": true, + "node": true + }, + "extends": "eslint:recommended", "parser": "babel-eslint" }, + "rollup": { + "input": "src/postcss.js", + "plugins": [ + "rollup-plugin-babel" + ], + "output": [ + { + "file": "dist/index.js", + "format": "cjs" + }, + { + "file": "dist/index.mjs", + "format": "esm" + } + ] + }, "keywords": [ "postcss", "css", diff --git a/src/cli.js b/src/cli.js index a46b30f..199ce8e 100644 --- a/src/cli.js +++ b/src/cli.js @@ -14,7 +14,7 @@ if (process.argv.length < 3) { } // get process and plugin options from the command line -const fileRegExp = /^[\w\/.]+$/; +const fileRegExp = /^[\w/.]+$/; const argRegExp = /^--(\w+)=("|')?(.+)\2$/; const relaxedJsonPropRegExp = /(['"])?([a-z0-9A-Z_]+)(['"])?:/g; const relaxedJsonValueRegExp = /("[a-z0-9A-Z_]+":\s*)(?!true|false|null|\d+)'?([A-z0-9]+)'?([,}])/g; @@ -106,6 +106,7 @@ function getStdin() { process.stdin.on('readable', () => { let chunk; + // eslint-disable-next-line no-cond-assign while (chunk = process.stdin.read()) { data += chunk; } diff --git a/src/lib/ids-by-execution-order.js b/src/lib/ids-by-execution-order.js index 5fadc89..986e911 100644 --- a/src/lib/ids-by-execution-order.js +++ b/src/lib/ids-by-execution-order.js @@ -19,7 +19,6 @@ export default [ 'all-property', // run all-property before other property polyfills 'color-functional-notation', 'double-position-gradients', - 'gray-function', 'hexadecimal-alpha-notation', 'lab-function', 'rebeccapurple-color', diff --git a/src/lib/plugins-by-id.js b/src/lib/plugins-by-id.js index 2508514..b7f02a0 100644 --- a/src/lib/plugins-by-id.js +++ b/src/lib/plugins-by-id.js @@ -1,7 +1,6 @@ import postcssAttributeCaseInsensitive from 'postcss-attribute-case-insensitive'; import postcssBlankPseudo from 'css-blank-pseudo/postcss'; import postcssColorFunctionalNotation from 'postcss-color-functional-notation'; -import postcssColorGray from 'postcss-color-gray'; import postcssColorHexAlpha from 'postcss-color-hex-alpha'; import postcssColorModFunction from 'postcss-color-mod-function'; import postcssColorRebeccapurple from 'postcss-color-rebeccapurple'; @@ -51,7 +50,6 @@ export default { 'focus-within-pseudo-class': postcssFocusWithin, 'font-variant-property': postcssFontVariant, 'gap-properties': postcssGapProperties, - 'gray-function': postcssColorGray, 'has-pseudo-class': postcssHasPseudo, 'hexadecimal-alpha-notation': postcssColorHexAlpha, 'image-set-function': postcssImageSetPolyfill, diff --git a/test/basic.autoprefixer.expect.css b/test/basic.autoprefixer.expect.css index b42bccc..24b7724 100644 --- a/test/basic.autoprefixer.expect.css +++ b/test/basic.autoprefixer.expect.css @@ -80,11 +80,6 @@ order: 10; } -.test-gray-function { - color: rgb(119,119,119); - color: rgba(119,119,119,0.5); -} - .test-rebeccapurple-color { color: #639; order: 11; @@ -207,7 +202,7 @@ order: 17; } -.test-matches-pseudo-class:first-child, .test-matches-pseudo-class.special { +.test-matches-pseudo-class:matches(:first-child, .special) { order: 18; } diff --git a/test/basic.autoprefixer.false.expect.css b/test/basic.autoprefixer.false.expect.css index b42bccc..24b7724 100644 --- a/test/basic.autoprefixer.false.expect.css +++ b/test/basic.autoprefixer.false.expect.css @@ -80,11 +80,6 @@ order: 10; } -.test-gray-function { - color: rgb(119,119,119); - color: rgba(119,119,119,0.5); -} - .test-rebeccapurple-color { color: #639; order: 11; @@ -207,7 +202,7 @@ order: 17; } -.test-matches-pseudo-class:first-child, .test-matches-pseudo-class.special { +.test-matches-pseudo-class:matches(:first-child, .special) { order: 18; } diff --git a/test/basic.ch38.expect.css b/test/basic.ch38.expect.css index b055649..234ae12 100644 --- a/test/basic.ch38.expect.css +++ b/test/basic.ch38.expect.css @@ -70,11 +70,6 @@ order: 10; } -.test-gray-function { - color: rgb(119,119,119); - color: rgba(119,119,119,0.5); -} - .test-rebeccapurple-color { color: rebeccapurple; order: 11; @@ -114,7 +109,7 @@ order: 17; } -.test-matches-pseudo-class:first-child, .test-matches-pseudo-class.special { +.test-matches-pseudo-class:matches(:first-child, .special) { order: 18; } diff --git a/test/basic.css b/test/basic.css index b39e184..1a332fe 100644 --- a/test/basic.css +++ b/test/basic.css @@ -60,11 +60,6 @@ order: 10; } -.test-gray-function { - color: gray(50); - color: gray(50 / 50%); -} - .test-rebeccapurple-color { color: rebeccapurple; order: 11; @@ -82,8 +77,8 @@ } .test-lab-function { - background-color: lab(40 56.6 39); - color: lch(40 68.8 34.5 / 50%); + background-color: lab(40% 56.6 39); + color: lch(40% 68.8 34.5 / 50%); order: 14; } diff --git a/test/basic.expect.css b/test/basic.expect.css index c81871e..bbeb6e3 100644 --- a/test/basic.expect.css +++ b/test/basic.expect.css @@ -3,10 +3,8 @@ } .test-custom-properties { - -webkit-box-ordinal-group: 2; - order: 1; - -webkit-box-ordinal-group: var(--order); - order: var(--order); + order: 1; + order: var(--order); } .test-image-set-function { @@ -23,8 +21,7 @@ .test-image-set-function { background-image: -webkit-image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); background-image: image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); - -webkit-box-ordinal-group: 3; - order: 2; + order: 2; } [dir="ltr"] .test-logical-properties-and-values { @@ -36,39 +33,32 @@ } .test-logical-properties-and-values { - -webkit-box-ordinal-group: 4; - order: 3; + order: 3; padding-top: 5px; padding-bottom: 5px; } .test-nesting-rules { - -webkit-box-ordinal-group: 5; - order: 4; + order: 4; & p { - -webkit-box-ordinal-group: 6; - order: 5; + order: 5; } - -webkit-box-ordinal-group: 7; - - order: 6; + order: 6; } @custom-media --narrow-window (max-width: 30em); @media (--narrow-window) { .test-custom-media-queries { - -webkit-box-ordinal-group: 8; - order: 7; + order: 7; } } @media (min-width: 480px) and (max-width: 767px) { .test-media-query-ranges { - -webkit-box-ordinal-group: 9; - order: 8; + order: 8; } } @@ -84,57 +74,44 @@ @custom-selector :--heading h1, h2, h3, h4, h5, h6; .test-custom-selectors:--heading { - -webkit-box-ordinal-group: 10; - order: 9; + order: 9; } .test-case-insensitive-attributes[frame=hsides],.test-case-insensitive-attributes[frame=Hsides],.test-case-insensitive-attributes[frame=hSides],.test-case-insensitive-attributes[frame=HSides],.test-case-insensitive-attributes[frame=hsIdes],.test-case-insensitive-attributes[frame=HsIdes],.test-case-insensitive-attributes[frame=hSIdes],.test-case-insensitive-attributes[frame=HSIdes],.test-case-insensitive-attributes[frame=hsiDes],.test-case-insensitive-attributes[frame=HsiDes],.test-case-insensitive-attributes[frame=hSiDes],.test-case-insensitive-attributes[frame=HSiDes],.test-case-insensitive-attributes[frame=hsIDes],.test-case-insensitive-attributes[frame=HsIDes],.test-case-insensitive-attributes[frame=hSIDes],.test-case-insensitive-attributes[frame=HSIDes],.test-case-insensitive-attributes[frame=hsidEs],.test-case-insensitive-attributes[frame=HsidEs],.test-case-insensitive-attributes[frame=hSidEs],.test-case-insensitive-attributes[frame=HSidEs],.test-case-insensitive-attributes[frame=hsIdEs],.test-case-insensitive-attributes[frame=HsIdEs],.test-case-insensitive-attributes[frame=hSIdEs],.test-case-insensitive-attributes[frame=HSIdEs],.test-case-insensitive-attributes[frame=hsiDEs],.test-case-insensitive-attributes[frame=HsiDEs],.test-case-insensitive-attributes[frame=hSiDEs],.test-case-insensitive-attributes[frame=HSiDEs],.test-case-insensitive-attributes[frame=hsIDEs],.test-case-insensitive-attributes[frame=HsIDEs],.test-case-insensitive-attributes[frame=hSIDEs],.test-case-insensitive-attributes[frame=HSIDEs],.test-case-insensitive-attributes[frame=hsideS],.test-case-insensitive-attributes[frame=HsideS],.test-case-insensitive-attributes[frame=hSideS],.test-case-insensitive-attributes[frame=HSideS],.test-case-insensitive-attributes[frame=hsIdeS],.test-case-insensitive-attributes[frame=HsIdeS],.test-case-insensitive-attributes[frame=hSIdeS],.test-case-insensitive-attributes[frame=HSIdeS],.test-case-insensitive-attributes[frame=hsiDeS],.test-case-insensitive-attributes[frame=HsiDeS],.test-case-insensitive-attributes[frame=hSiDeS],.test-case-insensitive-attributes[frame=HSiDeS],.test-case-insensitive-attributes[frame=hsIDeS],.test-case-insensitive-attributes[frame=HsIDeS],.test-case-insensitive-attributes[frame=hSIDeS],.test-case-insensitive-attributes[frame=HSIDeS],.test-case-insensitive-attributes[frame=hsidES],.test-case-insensitive-attributes[frame=HsidES],.test-case-insensitive-attributes[frame=hSidES],.test-case-insensitive-attributes[frame=HSidES],.test-case-insensitive-attributes[frame=hsIdES],.test-case-insensitive-attributes[frame=HsIdES],.test-case-insensitive-attributes[frame=hSIdES],.test-case-insensitive-attributes[frame=HSIdES],.test-case-insensitive-attributes[frame=hsiDES],.test-case-insensitive-attributes[frame=HsiDES],.test-case-insensitive-attributes[frame=hSiDES],.test-case-insensitive-attributes[frame=HSiDES],.test-case-insensitive-attributes[frame=hsIDES],.test-case-insensitive-attributes[frame=HsIDES],.test-case-insensitive-attributes[frame=hSIDES],.test-case-insensitive-attributes[frame=HSIDES] { - -webkit-box-ordinal-group: 11; - order: 10; -} - -.test-gray-function { - color: rgb(119,119,119); - color: rgba(119,119,119,0.5); + order: 10; } .test-rebeccapurple-color { color: #639; - -webkit-box-ordinal-group: 12; - order: 11; + order: 11; } .test-hexadecimal-alpha-notation { background-color: rgba(243,243,243,0.95294); color: rgba(0,0,0,0.2); - -webkit-box-ordinal-group: 13; - order: 12; + order: 12; } .test-color-functional-notation { color: rgb(70% 13.5% 13.5% / 50%); - -webkit-box-ordinal-group: 14; - order: 13; + order: 13; } .test-lab-function { background-color: rgb(178, 34, 34); color: rgba(178, 34, 34, 0.5); - -webkit-box-ordinal-group: 15; - order: 14; + order: 14; } .test-system-ui-font-family { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif; - -webkit-box-ordinal-group: 16; - order: 15; + order: 15; } .test-font-variant-property { font-feature-settings: "c2sc"; font-variant-caps: small-caps; - -webkit-box-ordinal-group: 17; - order: 16; + order: 16; } .test-all-property { @@ -145,9 +122,8 @@ background: transparent none repeat 0 0 / auto auto padding-box border-box scroll; border: medium none currentColor; border-collapse: separate; - -webkit-border-image: none; - -o-border-image: none; - border-image: none; + -o-border-image: none; + border-image: none; border-radius: 0; border-spacing: 0; bottom: auto; @@ -157,28 +133,21 @@ clear: none; clip: auto; color: #000; - -webkit-columns: auto; - -moz-columns: auto; - columns: auto; - -webkit-column-count: auto; - -moz-column-count: auto; - column-count: auto; - -webkit-column-fill: balance; - -moz-column-fill: balance; - column-fill: balance; + -moz-columns: auto; + columns: auto; + -moz-column-count: auto; + column-count: auto; + -moz-column-fill: balance; + column-fill: balance; grid-column-gap: normal; - -webkit-column-gap: normal; - -moz-column-gap: normal; - column-gap: normal; - -webkit-column-rule: medium none currentColor; - -moz-column-rule: medium none currentColor; - column-rule: medium none currentColor; - -webkit-column-span: 1; - -moz-column-span: 1; - column-span: 1; - -webkit-column-width: auto; - -moz-column-width: auto; - column-width: auto; + -moz-column-gap: normal; + column-gap: normal; + -moz-column-rule: medium none currentColor; + column-rule: medium none currentColor; + -moz-column-span: 1; + column-span: 1; + -moz-column-width: auto; + column-width: auto; content: normal; counter-increment: none; counter-reset: none; @@ -217,10 +186,8 @@ page-break-after: auto; page-break-before: auto; page-break-inside: auto; - -webkit-perspective: none; - perspective: none; - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; + perspective: none; + perspective-origin: 50% 50%; position: static; right: auto; -moz-tab-size: 8; @@ -235,13 +202,9 @@ text-shadow: none; text-transform: none; top: auto; - -webkit-transform: none; - transform: none; - -webkit-transform-origin: 50% 50% 0; - transform-origin: 50% 50% 0; - -webkit-transform-style: flat; - transform-style: flat; - -webkit-transition: none 0s ease 0s; + transform: none; + transform-origin: 50% 50% 0; + transform-style: flat; transition: none 0s ease 0s; unicode-bidi: normal; vertical-align: baseline; @@ -252,28 +215,23 @@ word-spacing: normal; z-index: auto; all: initial; - -webkit-box-ordinal-group: 18; - order: 17; + order: 17; } -.test-matches-pseudo-class:first-child, .test-matches-pseudo-class.special { - -webkit-box-ordinal-group: 19; - order: 18; +.test-matches-pseudo-class:matches(:first-child, .special) { + order: 18; } .test-not-pseudo-class:not(:first-child):not(.special) { - -webkit-box-ordinal-group: 20; - order: 19; + order: 19; } .test-any-link-pseudo-class:link,.test-any-link-pseudo-class:visited { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } .test-any-link-pseudo-class:-webkit-any-link { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } .test-any-link-pseudo-class:-moz-any-link { @@ -281,29 +239,24 @@ } .test-any-link-pseudo-class:any-link { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } [dir="rtl"] .test-dir-pseudo-class { - -webkit-box-ordinal-group: 22; - order: 21; + order: 21; } .test-overflow-wrap-property { - -webkit-box-ordinal-group: 23; - order: 22; + order: 22; word-wrap: break-word; } .test-focus-visible-pseudo-class.focus-visible { - -webkit-box-ordinal-group: 24; - order: 23; + order: 23; } .test-focus-visible-pseudo-class:focus-visible { - -webkit-box-ordinal-group: 24; - order: 23; + order: 23; } .test-double-position-gradients { diff --git a/test/basic.ff49.expect.css b/test/basic.ff49.expect.css index 5b86631..416b52c 100644 --- a/test/basic.ff49.expect.css +++ b/test/basic.ff49.expect.css @@ -71,11 +71,6 @@ order: 10; } -.test-gray-function { - color: rgb(119,119,119); - color: rgba(119,119,119,0.5); -} - .test-rebeccapurple-color { color: rebeccapurple; order: 11; @@ -113,7 +108,7 @@ order: 17; } -.test-matches-pseudo-class:first-child, .test-matches-pseudo-class.special { +.test-matches-pseudo-class:matches(:first-child, .special) { order: 18; } diff --git a/test/basic.nesting.expect.css b/test/basic.nesting.expect.css index 33de91e..a30c323 100644 --- a/test/basic.nesting.expect.css +++ b/test/basic.nesting.expect.css @@ -3,54 +3,45 @@ } .test-custom-properties { - -webkit-box-ordinal-group: var(--order); - order: var(--order); + order: var(--order); } .test-image-set-function { background-image: -webkit-image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); background-image: image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); - -webkit-box-ordinal-group: 3; - order: 2; + order: 2; } .test-logical-properties-and-values { margin: logical 1px 2px 3px 4px; - -webkit-box-ordinal-group: 4; - order: 3; + order: 3; padding-block: 5px; } .test-nesting-rules { - -webkit-box-ordinal-group: 5; - order: 4; + order: 4; } .test-nesting-rules p { - -webkit-box-ordinal-group: 6; - order: 5; + order: 5; } .test-nesting-rules { - -webkit-box-ordinal-group: 7; - - order: 6; + order: 6; } @custom-media --narrow-window (max-width: 30em); @media (--narrow-window) { .test-custom-media-queries { - -webkit-box-ordinal-group: 8; - order: 7; + order: 7; } } @media (480px <= width < 768px) { .test-media-query-ranges { - -webkit-box-ordinal-group: 9; - order: 8; + order: 8; } } @@ -66,77 +57,60 @@ @custom-selector :--heading h1, h2, h3, h4, h5, h6; .test-custom-selectors:--heading { - -webkit-box-ordinal-group: 10; - order: 9; + order: 9; } .test-case-insensitive-attributes[frame=hsides i] { - -webkit-box-ordinal-group: 11; - order: 10; -} - -.test-gray-function { - color: gray(50); - color: gray(50 / 50%); + order: 10; } .test-rebeccapurple-color { color: rebeccapurple; - -webkit-box-ordinal-group: 12; - order: 11; + order: 11; } .test-hexadecimal-alpha-notation { background-color: #f3f3f3f3; color: #0003; - -webkit-box-ordinal-group: 13; - order: 12; + order: 12; } .test-color-functional-notation { color: rgb(70% 13.5% 13.5% / 50%); - -webkit-box-ordinal-group: 14; - order: 13; + order: 13; } .test-lab-function { - background-color: lab(40 56.6 39); - color: lch(40 68.8 34.5 / 50%); - -webkit-box-ordinal-group: 15; - order: 14; + background-color: lab(40% 56.6 39); + color: lch(40% 68.8 34.5 / 50%); + order: 14; } .test-system-ui-font-family { font-family: system-ui; - -webkit-box-ordinal-group: 16; - order: 15; + order: 15; } .test-font-variant-property { font-variant-caps: small-caps; - -webkit-box-ordinal-group: 17; - order: 16; + order: 16; } .test-all-property { all: initial; - -webkit-box-ordinal-group: 18; - order: 17; + order: 17; } .test-matches-pseudo-class:matches(:first-child, .special) { - -webkit-box-ordinal-group: 19; - order: 18; + order: 18; } .test-not-pseudo-class:not(:first-child, .special) { - -webkit-box-ordinal-group: 20; - order: 19; + order: 19; } .test-any-link-pseudo-class:-webkit-any-link { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } .test-any-link-pseudo-class:-moz-any-link { @@ -144,24 +118,20 @@ } .test-any-link-pseudo-class:any-link { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } .test-dir-pseudo-class:dir(rtl) { - -webkit-box-ordinal-group: 22; - order: 21; + order: 21; } .test-overflow-wrap-property { - -webkit-box-ordinal-group: 23; - order: 22; + order: 22; overflow-wrap: break-word; } .test-focus-visible-pseudo-class:focus-visible { - -webkit-box-ordinal-group: 24; - order: 23; + order: 23; } .test-double-position-gradients { diff --git a/test/basic.stage0-ff49.expect.css b/test/basic.stage0-ff49.expect.css index 53699b6..79fe510 100644 --- a/test/basic.stage0-ff49.expect.css +++ b/test/basic.stage0-ff49.expect.css @@ -75,11 +75,6 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te order: 10; } -.test-gray-function { - color: rgb(119,119,119); - color: rgba(119,119,119,0.5); -} - .test-rebeccapurple-color { color: rebeccapurple; order: 11; @@ -117,7 +112,7 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te order: 17; } -.test-matches-pseudo-class:first-child, .test-matches-pseudo-class.special { +.test-matches-pseudo-class:matches(:first-child, .special) { order: 18; } diff --git a/test/basic.stage0.expect.css b/test/basic.stage0.expect.css index 1ed5881..c419c2f 100644 --- a/test/basic.stage0.expect.css +++ b/test/basic.stage0.expect.css @@ -3,10 +3,8 @@ } .test-custom-properties { - -webkit-box-ordinal-group: 2; - order: 1; - -webkit-box-ordinal-group: var(--order); - order: var(--order); + order: 1; + order: var(--order); } .test-image-set-function { @@ -23,8 +21,7 @@ .test-image-set-function { background-image: -webkit-image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); background-image: image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); - -webkit-box-ordinal-group: 3; - order: 2; + order: 2; } [dir="ltr"] .test-logical-properties-and-values { @@ -36,40 +33,33 @@ } .test-logical-properties-and-values { - -webkit-box-ordinal-group: 4; - order: 3; + order: 3; padding-top: 5px; padding-bottom: 5px; } .test-nesting-rules { - -webkit-box-ordinal-group: 5; - order: 4; + order: 4; } .test-nesting-rules p { - -webkit-box-ordinal-group: 6; - order: 5; + order: 5; } .test-nesting-rules { - -webkit-box-ordinal-group: 7; - - order: 6; + order: 6; } @media (max-width: 30em) { .test-custom-media-queries { - -webkit-box-ordinal-group: 8; - order: 7; + order: 7; } } @media (min-width: 480px) and (max-width: 767px) { .test-media-query-ranges { - -webkit-box-ordinal-group: 9; - order: 8; + order: 8; } } @@ -88,57 +78,44 @@ } h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.test-custom-selectors,h5.test-custom-selectors,h6.test-custom-selectors { - -webkit-box-ordinal-group: 10; - order: 9; + order: 9; } .test-case-insensitive-attributes[frame=hsides],.test-case-insensitive-attributes[frame=Hsides],.test-case-insensitive-attributes[frame=hSides],.test-case-insensitive-attributes[frame=HSides],.test-case-insensitive-attributes[frame=hsIdes],.test-case-insensitive-attributes[frame=HsIdes],.test-case-insensitive-attributes[frame=hSIdes],.test-case-insensitive-attributes[frame=HSIdes],.test-case-insensitive-attributes[frame=hsiDes],.test-case-insensitive-attributes[frame=HsiDes],.test-case-insensitive-attributes[frame=hSiDes],.test-case-insensitive-attributes[frame=HSiDes],.test-case-insensitive-attributes[frame=hsIDes],.test-case-insensitive-attributes[frame=HsIDes],.test-case-insensitive-attributes[frame=hSIDes],.test-case-insensitive-attributes[frame=HSIDes],.test-case-insensitive-attributes[frame=hsidEs],.test-case-insensitive-attributes[frame=HsidEs],.test-case-insensitive-attributes[frame=hSidEs],.test-case-insensitive-attributes[frame=HSidEs],.test-case-insensitive-attributes[frame=hsIdEs],.test-case-insensitive-attributes[frame=HsIdEs],.test-case-insensitive-attributes[frame=hSIdEs],.test-case-insensitive-attributes[frame=HSIdEs],.test-case-insensitive-attributes[frame=hsiDEs],.test-case-insensitive-attributes[frame=HsiDEs],.test-case-insensitive-attributes[frame=hSiDEs],.test-case-insensitive-attributes[frame=HSiDEs],.test-case-insensitive-attributes[frame=hsIDEs],.test-case-insensitive-attributes[frame=HsIDEs],.test-case-insensitive-attributes[frame=hSIDEs],.test-case-insensitive-attributes[frame=HSIDEs],.test-case-insensitive-attributes[frame=hsideS],.test-case-insensitive-attributes[frame=HsideS],.test-case-insensitive-attributes[frame=hSideS],.test-case-insensitive-attributes[frame=HSideS],.test-case-insensitive-attributes[frame=hsIdeS],.test-case-insensitive-attributes[frame=HsIdeS],.test-case-insensitive-attributes[frame=hSIdeS],.test-case-insensitive-attributes[frame=HSIdeS],.test-case-insensitive-attributes[frame=hsiDeS],.test-case-insensitive-attributes[frame=HsiDeS],.test-case-insensitive-attributes[frame=hSiDeS],.test-case-insensitive-attributes[frame=HSiDeS],.test-case-insensitive-attributes[frame=hsIDeS],.test-case-insensitive-attributes[frame=HsIDeS],.test-case-insensitive-attributes[frame=hSIDeS],.test-case-insensitive-attributes[frame=HSIDeS],.test-case-insensitive-attributes[frame=hsidES],.test-case-insensitive-attributes[frame=HsidES],.test-case-insensitive-attributes[frame=hSidES],.test-case-insensitive-attributes[frame=HSidES],.test-case-insensitive-attributes[frame=hsIdES],.test-case-insensitive-attributes[frame=HsIdES],.test-case-insensitive-attributes[frame=hSIdES],.test-case-insensitive-attributes[frame=HSIdES],.test-case-insensitive-attributes[frame=hsiDES],.test-case-insensitive-attributes[frame=HsiDES],.test-case-insensitive-attributes[frame=hSiDES],.test-case-insensitive-attributes[frame=HSiDES],.test-case-insensitive-attributes[frame=hsIDES],.test-case-insensitive-attributes[frame=HsIDES],.test-case-insensitive-attributes[frame=hSIDES],.test-case-insensitive-attributes[frame=HSIDES] { - -webkit-box-ordinal-group: 11; - order: 10; -} - -.test-gray-function { - color: rgb(119,119,119); - color: rgba(119,119,119,0.5); + order: 10; } .test-rebeccapurple-color { color: #639; - -webkit-box-ordinal-group: 12; - order: 11; + order: 11; } .test-hexadecimal-alpha-notation { background-color: rgba(243,243,243,0.95294); color: rgba(0,0,0,0.2); - -webkit-box-ordinal-group: 13; - order: 12; + order: 12; } .test-color-functional-notation { color: rgba(178, 34, 34, 0.5); - -webkit-box-ordinal-group: 14; - order: 13; + order: 13; } .test-lab-function { background-color: rgb(178, 34, 34); color: rgba(178, 34, 34, 0.5); - -webkit-box-ordinal-group: 15; - order: 14; + order: 14; } .test-system-ui-font-family { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif; - -webkit-box-ordinal-group: 16; - order: 15; + order: 15; } .test-font-variant-property { font-feature-settings: "c2sc"; font-variant-caps: small-caps; - -webkit-box-ordinal-group: 17; - order: 16; + order: 16; } .test-all-property { @@ -149,9 +126,8 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te background: transparent none repeat 0 0 / auto auto padding-box border-box scroll; border: medium none currentColor; border-collapse: separate; - -webkit-border-image: none; - -o-border-image: none; - border-image: none; + -o-border-image: none; + border-image: none; border-radius: 0; border-spacing: 0; bottom: auto; @@ -161,28 +137,21 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te clear: none; clip: auto; color: #000; - -webkit-columns: auto; - -moz-columns: auto; - columns: auto; - -webkit-column-count: auto; - -moz-column-count: auto; - column-count: auto; - -webkit-column-fill: balance; - -moz-column-fill: balance; - column-fill: balance; + -moz-columns: auto; + columns: auto; + -moz-column-count: auto; + column-count: auto; + -moz-column-fill: balance; + column-fill: balance; grid-column-gap: normal; - -webkit-column-gap: normal; - -moz-column-gap: normal; - column-gap: normal; - -webkit-column-rule: medium none currentColor; - -moz-column-rule: medium none currentColor; - column-rule: medium none currentColor; - -webkit-column-span: 1; - -moz-column-span: 1; - column-span: 1; - -webkit-column-width: auto; - -moz-column-width: auto; - column-width: auto; + -moz-column-gap: normal; + column-gap: normal; + -moz-column-rule: medium none currentColor; + column-rule: medium none currentColor; + -moz-column-span: 1; + column-span: 1; + -moz-column-width: auto; + column-width: auto; content: normal; counter-increment: none; counter-reset: none; @@ -221,10 +190,8 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te page-break-after: auto; page-break-before: auto; page-break-inside: auto; - -webkit-perspective: none; - perspective: none; - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; + perspective: none; + perspective-origin: 50% 50%; position: static; right: auto; -moz-tab-size: 8; @@ -239,13 +206,9 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te text-shadow: none; text-transform: none; top: auto; - -webkit-transform: none; - transform: none; - -webkit-transform-origin: 50% 50% 0; - transform-origin: 50% 50% 0; - -webkit-transform-style: flat; - transform-style: flat; - -webkit-transition: none 0s ease 0s; + transform: none; + transform-origin: 50% 50% 0; + transform-style: flat; transition: none 0s ease 0s; unicode-bidi: normal; vertical-align: baseline; @@ -256,28 +219,23 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te word-spacing: normal; z-index: auto; all: initial; - -webkit-box-ordinal-group: 18; - order: 17; + order: 17; } -.test-matches-pseudo-class:first-child, .test-matches-pseudo-class.special { - -webkit-box-ordinal-group: 19; - order: 18; +.test-matches-pseudo-class:matches(:first-child, .special) { + order: 18; } .test-not-pseudo-class:not(:first-child):not(.special) { - -webkit-box-ordinal-group: 20; - order: 19; + order: 19; } .test-any-link-pseudo-class:link,.test-any-link-pseudo-class:visited { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } .test-any-link-pseudo-class:-webkit-any-link { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } .test-any-link-pseudo-class:-moz-any-link { @@ -285,29 +243,24 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te } .test-any-link-pseudo-class:any-link { - -webkit-box-ordinal-group: 21; - order: 20; + order: 20; } [dir="rtl"] .test-dir-pseudo-class { - -webkit-box-ordinal-group: 22; - order: 21; + order: 21; } .test-overflow-wrap-property { - -webkit-box-ordinal-group: 23; - order: 22; + order: 22; word-wrap: break-word; } .test-focus-visible-pseudo-class.focus-visible { - -webkit-box-ordinal-group: 24; - order: 23; + order: 23; } .test-focus-visible-pseudo-class:focus-visible { - -webkit-box-ordinal-group: 24; - order: 23; + order: 23; } .test-double-position-gradients { diff --git a/test/import.expect.css b/test/import.expect.css index baff19d..ded9c5e 100644 --- a/test/import.expect.css +++ b/test/import.expect.css @@ -1,19 +1,15 @@ .test-custom-properties { - -webkit-box-ordinal-group: 2; - order: 1; - -webkit-box-ordinal-group: var(--order); - order: var(--order); + order: 1; + order: var(--order); } @media (max-width: 40rem) { .test-custom-media-queries { - -webkit-box-ordinal-group: 3; - order: 2; + order: 2; } } h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.test-custom-selectors,h5.test-custom-selectors,h6.test-custom-selectors { - -webkit-box-ordinal-group: 4; - order: 3; + order: 3; } From d47b1eefd75b288f6c5c64e009d5b84538b4e944 Mon Sep 17 00:00:00 2001 From: Jonathan Neal Date: Wed, 22 Sep 2021 09:53:04 -0400 Subject: [PATCH 02/12] switch to github testing workflow --- .github/workflows/test.yml | 18 ++++++++++++++++++ .gitignore | 2 +- .travis.yml | 16 ---------------- README.md | 6 +++--- 4 files changed, 22 insertions(+), 20 deletions(-) create mode 100644 .github/workflows/test.yml delete mode 100644 .travis.yml diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml new file mode 100644 index 0000000..4a287db --- /dev/null +++ b/.github/workflows/test.yml @@ -0,0 +1,18 @@ +name: test +on: + push: + +jobs: + test: + runs-on: ubuntu-latest + strategy: + matrix: + node: [12, 16] + steps: + - uses: actions/checkout@v2 + - uses: actions/setup-node@v2 + with: + node-version: ${{ matrix.node }} + + - run: yarn install --ignore-scripts + - run: yarn run test diff --git a/.gitignore b/.gitignore index 5bd3ef6..c6e7c19 100644 --- a/.gitignore +++ b/.gitignore @@ -6,7 +6,7 @@ package-lock.json .* !.editorconfig !.gitattributes +!.github !.gitignore !.rollup.js !.tape.js -!.travis.yml diff --git a/.travis.yml b/.travis.yml deleted file mode 100644 index bb855a0..0000000 --- a/.travis.yml +++ /dev/null @@ -1,16 +0,0 @@ -# https://docs.travis-ci.com/user/travis-lint - -language: node_js - -os: - - windows - - linux - - osx - -node_js: - - 10 - -install: - - git config --global core.autocrlf false - - git checkout -qf ${TRAVIS_COMMIT} - - npm install --ignore-scripts diff --git a/README.md b/README.md index 02d8a90..9c847bd 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ # PostCSS Preset Env [PostCSS][postcss] [npm version][npm-url] -[build status][cli-url] +[build status][cli-url] [support chat][git-url] [PostCSS Preset Env] lets you convert modern CSS into something most browsers @@ -362,8 +362,8 @@ postcssPresetEnv({ }); ``` -[cli-img]: https://img.shields.io/travis/csstools/postcss-preset-env/master.svg -[cli-url]: https://travis-ci.org/csstools/postcss-preset-env +[cli-img]: https://github.com/postcss/postcss-preset-env/workflows/test/badge.svg +[cli-url]: https://github.com/postcss/postcss-preset-env/actions/workflows/test.yml?query=workflow/test [git-img]: https://img.shields.io/badge/support-chat-blue.svg [git-url]: https://gitter.im/postcss/postcss [npm-img]: https://img.shields.io/npm/v/postcss-preset-env.svg From ba54d79fbd53b3816601d4921e73035cb9889c7e Mon Sep 17 00:00:00 2001 From: Jonas Thelemann Date: Wed, 22 Sep 2021 16:08:32 +0200 Subject: [PATCH 03/12] chore(deps): update to all new major versions (#213) --- .gitignore | 1 + CHANGELOG.md | 51 +++++++++++++++++++++++++---------------- package.json | 64 +++++++++++++++++++++++++++++----------------------- 3 files changed, 69 insertions(+), 47 deletions(-) diff --git a/.gitignore b/.gitignore index c6e7c19..1ee23c3 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,7 @@ dist node_modules package-lock.json +yarn.lock *.log* *.result.css .* diff --git a/CHANGELOG.md b/CHANGELOG.md index d6845ed..1b77f17 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,30 +1,43 @@ # Changes to PostCSS Preset Env -### 7.0.0 (April 25, 2020) +### 7.0.0 (September 22, 2021) -- Updated `autoprefixer` to 9.7.6 (minor) +- Updated `autoprefixer` to 10.3.5 (major) - Updated `browserslist` to 4.12.0 (minor) - Updated `caniuse-lite` to 1.0.30001048 (patch) -- Updated `css-blank-pseudo` to 1.0.0 (major) -- Updated `css-has-pseudo` to 1.0.0 (major) -- Updated `css-prefers-color-scheme` to 4.0.0 (major) +- Updated `css-blank-pseudo` to 2.0.0 (major) +- Updated `css-has-pseudo` to 2.0.0 (major) +- Updated `css-prefers-color-scheme` to 5.0.0 (major) - Updated `cssdb` to 5.0.0 (major) -- Updated `postcss` to 7.0.27 (patch) -- Updated `postcss-attribute-case-insensitive` to 4.0.2 (patch) -- Updated `postcss-color-functional-notation` to 3.0.2 (major) -- Updated `postcss-color-hex-alpha` to 6.0.0 (major) -- Updated `postcss-color-rebeccapurple` to 6.0.0 (major) -- Updated `postcss-custom-properties` to 9.1.1 (major) -- Updated `postcss-env-function` to 3.0.0 (major) -- Updated `postcss-focus-visible` to 5.0.0 (major) -- Updated `postcss-focus-within` to 4.0.0 (major) +- Updated `postcss` to 7.0.27 (major) +- Updated `postcss-attribute-case-insensitive` to 5.0.0 (major) +- Updated `postcss-color-functional-notation` to 4.0.0 (major) +- Updated `postcss-color-hex-alpha` to 7.0.0 (major) +- Updated `postcss-color-rebeccapurple` to 7.0.0 (major) +- Updated `postcss-custom-media` to 8.0.0 (major) +- Updated `postcss-custom-properties` to 12.0.0 (major) +- Updated `postcss-custom-selectors` to 6.0.0 (major) +- Updated `postcss-dir-pseudo-class` to 6.0.0 (major) +- Updated `postcss-double-position-gradients` to 3.0.0 (major) +- Updated `postcss-env-function` to 4.0.0 (major) +- Updated `postcss-focus-visible` to 6.0.1 (major) +- Updated `postcss-focus-within` to 5.0.1 (major) +- Updated `postcss-font-variant` to 5.0.0 (major) +- Updated `postcss-gap-properties` to 3.0.0 (major) +- Updated `postcss-image-set-function` to 4.0.0 (major) - Updated `postcss-initial` to 3.0.2 (patch) -- Updated `postcss-lab-function` to 3.1.2 (major) -- Updated `postcss-logical` to 4.0.2 (major) -- Updated `postcss-nesting` to 7.0.1 (patch) -- Updated `postcss-place` to 5.0.0 (major) +- Updated `postcss-lab-function` to 4.0.0 (major) +- Updated `postcss-logical` to 5.0.0 (major) +- Updated `postcss-media-minmax` to 5.0.0 (major) +- Updated `postcss-nesting` to 8.0.1 (major) +- Updated `postcss-overflow-shorthand` to 3.0.0 (major) +- Updated `postcss-page-break` to 3.0.4 (major) +- Updated `postcss-place` to 7.0.0 (major) +- Updated `postcss-pseudo-class-any-link` to 7.0.0 (major) +- Updated `postcss-replace-overflow-wrap` to 4.0.0 (major) +- Updated `postcss-selector-matches` to 4.0.0 (major) - Removed `postcss-color-gray` -- Updated support for Node 10+ (major) +- Updated support for Node 12+ (major) ### 6.7.0 (July 8, 2019) diff --git a/package.json b/package.json index 19c597b..da51d35 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,10 @@ "prepublishOnly": "npm test" }, "engines": { - "node": ">=10.0.0" + "node": ">=12" + }, + "peerDependencies": { + "postcss": "^8.3" }, "dependencies": { "autoprefixer": "^9.6.1", @@ -39,38 +42,37 @@ "postcss-color-gray": "^5.0.0", "postcss-color-hex-alpha": "^5.0.3", "postcss-color-mod-function": "^3.0.3", - "postcss-color-rebeccapurple": "^6.0.0", - "postcss-custom-media": "^7.0.8", - "postcss-custom-properties": "^9.1.1", - "postcss-custom-selectors": "^5.1.2", - "postcss-dir-pseudo-class": "^5.0.0", - "postcss-double-position-gradients": "^2.0.0", - "postcss-env-function": "^3.0.0", - "postcss-focus-visible": "^5.0.0", - "postcss-focus-within": "^4.0.0", - "postcss-font-variant": "^4.0.0", - "postcss-gap-properties": "^2.0.0", - "postcss-image-set-function": "^3.0.1", + "postcss-color-rebeccapurple": "^7.0.0", + "postcss-custom-media": "^8.0.0", + "postcss-custom-properties": "^12.0.0", + "postcss-custom-selectors": "^6.0.0", + "postcss-dir-pseudo-class": "^6.0.0", + "postcss-double-position-gradients": "^3.0.0", + "postcss-env-function": "^4.0.0", + "postcss-focus-visible": "^6.0.1", + "postcss-focus-within": "^5.0.1", + "postcss-font-variant": "^5.0.0", + "postcss-gap-properties": "^3.0.0", + "postcss-image-set-function": "^4.0.0", "postcss-initial": "^3.0.2", - "postcss-lab-function": "^3.1.2", - "postcss-logical": "^4.0.2", - "postcss-media-minmax": "^4.0.0", - "postcss-nesting": "^7.0.1", - "postcss-overflow-shorthand": "^2.0.0", - "postcss-page-break": "^2.0.0", - "postcss-place": "^5.0.0", - "postcss-pseudo-class-any-link": "^6.0.0", - "postcss-replace-overflow-wrap": "^3.0.0", + "postcss-lab-function": "^4.0.0", + "postcss-logical": "^5.0.0", + "postcss-media-minmax": "^5.0.0", + "postcss-nesting": "^8.0.1", + "postcss-overflow-shorthand": "^3.0.0", + "postcss-page-break": "^3.0.4", + "postcss-place": "^7.0.0", + "postcss-pseudo-class-any-link": "^7.0.0", + "postcss-replace-overflow-wrap": "^4.0.0", "postcss-selector-matches": "^4.0.0", - "postcss-selector-not": "^4.0.0" + "postcss-selector-not": "^5.0.0" }, "devDependencies": { "@babel/core": "^7.9.0", "@babel/preset-env": "^7.9.5", - "babel-eslint": "^10.1.0", - "eslint": "^6.8.0", - "postcss-simple-vars": "^5.0.2", - "postcss-tape": "^5.0.2", + "eslint": "^7.32.0", + "postcss-simple-vars": "^6.0.3", + "postcss-tape": "^6.0.1", "pre-commit": "^1.2.2", "rollup": "^2.7.3", "rollup-plugin-babel": "^4.4.0" @@ -87,11 +89,16 @@ }, "eslintConfig": { "env": { + "browser": true, "es6": true, "node": true }, "extends": "eslint:recommended", - "parser": "babel-eslint" + "parserOptions": { + "ecmaVersion": 2020, + "sourceType": "module" + }, + "root": true }, "rollup": { "input": "src/postcss.js", @@ -100,6 +107,7 @@ ], "output": [ { + "exports": "default", "file": "dist/index.js", "format": "cjs" }, From 1a0fdac629c6c8f9b36b1aaa2d31eb99bb5cb920 Mon Sep 17 00:00:00 2001 From: Jonathan Neal Date: Wed, 22 Sep 2021 10:09:52 -0400 Subject: [PATCH 04/12] update package dependencies --- package.json | 30 +++++++++++++++--------------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/package.json b/package.json index da51d35..653fa5d 100644 --- a/package.json +++ b/package.json @@ -29,18 +29,18 @@ "postcss": "^8.3" }, "dependencies": { - "autoprefixer": "^9.6.1", - "browserslist": "^4.6.4", - "caniuse-lite": "^1.0.30001040", - "css-blank-pseudo": "^0.1.4", - "css-has-pseudo": "^0.10.0", - "css-prefers-color-scheme": "^3.1.1", - "cssdb": "^4.4.0", - "postcss": "^7.0.17", - "postcss-attribute-case-insensitive": "^4.0.1", - "postcss-color-functional-notation": "^2.0.1", + "autoprefixer": "^10.3.5", + "browserslist": "^4.17.1", + "caniuse-lite": "^1.0.30001259", + "css-blank-pseudo": "^2.0.0", + "css-has-pseudo": "^2.0.0", + "css-prefers-color-scheme": "^5.0.0", + "cssdb": "^5.0.0", + "postcss": "^8.3.7", + "postcss-attribute-case-insensitive": "^5.0.0", + "postcss-color-functional-notation": "^4.0.0", "postcss-color-gray": "^5.0.0", - "postcss-color-hex-alpha": "^5.0.3", + "postcss-color-hex-alpha": "^7.0.0", "postcss-color-mod-function": "^3.0.3", "postcss-color-rebeccapurple": "^7.0.0", "postcss-custom-media": "^8.0.0", @@ -54,7 +54,7 @@ "postcss-font-variant": "^5.0.0", "postcss-gap-properties": "^3.0.0", "postcss-image-set-function": "^4.0.0", - "postcss-initial": "^3.0.2", + "postcss-initial": "^3.0.4", "postcss-lab-function": "^4.0.0", "postcss-logical": "^5.0.0", "postcss-media-minmax": "^5.0.0", @@ -68,13 +68,13 @@ "postcss-selector-not": "^5.0.0" }, "devDependencies": { - "@babel/core": "^7.9.0", - "@babel/preset-env": "^7.9.5", + "@babel/core": "^7.15.5", + "@babel/preset-env": "^7.15.6", "eslint": "^7.32.0", "postcss-simple-vars": "^6.0.3", "postcss-tape": "^6.0.1", "pre-commit": "^1.2.2", - "rollup": "^2.7.3", + "rollup": "^2.57.0", "rollup-plugin-babel": "^4.4.0" }, "babel": { From d5af5ac7d0a4dc78f48dcdb54a5f7f9f224da20e Mon Sep 17 00:00:00 2001 From: Jonathan Neal Date: Wed, 22 Sep 2021 10:27:46 -0400 Subject: [PATCH 05/12] update dependencies --- package.json | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/package.json b/package.json index 653fa5d..02a9ad0 100644 --- a/package.json +++ b/package.json @@ -39,9 +39,7 @@ "postcss": "^8.3.7", "postcss-attribute-case-insensitive": "^5.0.0", "postcss-color-functional-notation": "^4.0.0", - "postcss-color-gray": "^5.0.0", - "postcss-color-hex-alpha": "^7.0.0", - "postcss-color-mod-function": "^3.0.3", + "postcss-color-hex-alpha": "^8.0.0", "postcss-color-rebeccapurple": "^7.0.0", "postcss-custom-media": "^8.0.0", "postcss-custom-properties": "^12.0.0", @@ -54,7 +52,6 @@ "postcss-font-variant": "^5.0.0", "postcss-gap-properties": "^3.0.0", "postcss-image-set-function": "^4.0.0", - "postcss-initial": "^3.0.4", "postcss-lab-function": "^4.0.0", "postcss-logical": "^5.0.0", "postcss-media-minmax": "^5.0.0", @@ -64,7 +61,6 @@ "postcss-place": "^7.0.0", "postcss-pseudo-class-any-link": "^7.0.0", "postcss-replace-overflow-wrap": "^4.0.0", - "postcss-selector-matches": "^4.0.0", "postcss-selector-not": "^5.0.0" }, "devDependencies": { From 4b1106dfc6caa01dcdf4e1deb012e2407b3a251a Mon Sep 17 00:00:00 2001 From: Jonathan Neal Date: Wed, 22 Sep 2021 10:43:37 -0400 Subject: [PATCH 06/12] wip --- src/lib/plugins-by-id.js | 6 - src/patch/postcss-system-ui-font-family.js | 17 ++- test/basic.autoprefixer.false.expect.css | 142 ++------------------- 3 files changed, 22 insertions(+), 143 deletions(-) diff --git a/src/lib/plugins-by-id.js b/src/lib/plugins-by-id.js index b7f02a0..e2a6f12 100644 --- a/src/lib/plugins-by-id.js +++ b/src/lib/plugins-by-id.js @@ -2,7 +2,6 @@ import postcssAttributeCaseInsensitive from 'postcss-attribute-case-insensitive' import postcssBlankPseudo from 'css-blank-pseudo/postcss'; import postcssColorFunctionalNotation from 'postcss-color-functional-notation'; import postcssColorHexAlpha from 'postcss-color-hex-alpha'; -import postcssColorModFunction from 'postcss-color-mod-function'; import postcssColorRebeccapurple from 'postcss-color-rebeccapurple'; import postcssCustomMedia from 'postcss-custom-media'; import postcssCustomProperties from 'postcss-custom-properties'; @@ -17,7 +16,6 @@ import postcssFontFamilySystemUi from '../patch/postcss-system-ui-font-family'; import postcssGapProperties from 'postcss-gap-properties'; import postcssHasPseudo from 'css-has-pseudo/postcss'; import postcssImageSetPolyfill from 'postcss-image-set-function'; -import postcssInitial from 'postcss-initial'; import postcssLabFunction from 'postcss-lab-function'; import postcssLogical from 'postcss-logical'; import postcssMediaMinmax from 'postcss-media-minmax'; @@ -28,18 +26,15 @@ import postcssPlace from 'postcss-place'; import postcssPrefersColorScheme from 'css-prefers-color-scheme/postcss'; import postcssPseudoClassAnyLink from 'postcss-pseudo-class-any-link'; import postcssReplaceOverflowWrap from 'postcss-replace-overflow-wrap'; -import postcssSelectorMatches from 'postcss-selector-matches'; import postcssSelectorNot from 'postcss-selector-not'; // postcss plugins ordered by id export default { - 'all-property': postcssInitial, 'any-link-pseudo-class': postcssPseudoClassAnyLink, 'blank-pseudo-class': postcssBlankPseudo, 'break-properties': postcssPageBreak, 'case-insensitive-attributes': postcssAttributeCaseInsensitive, 'color-functional-notation': postcssColorFunctionalNotation, - 'color-mod-function': postcssColorModFunction, 'custom-media-queries': postcssCustomMedia, 'custom-properties': postcssCustomProperties, 'custom-selectors': postcssCustomSelectors, @@ -55,7 +50,6 @@ export default { 'image-set-function': postcssImageSetPolyfill, 'lab-function': postcssLabFunction, 'logical-properties-and-values': postcssLogical, - 'matches-pseudo-class': postcssSelectorMatches, 'media-query-ranges': postcssMediaMinmax, 'nesting-rules': postcssNesting, 'not-pseudo-class': postcssSelectorNot, diff --git a/src/patch/postcss-system-ui-font-family.js b/src/patch/postcss-system-ui-font-family.js index 02d983e..69eb48e 100644 --- a/src/patch/postcss-system-ui-font-family.js +++ b/src/patch/postcss-system-ui-font-family.js @@ -1,10 +1,13 @@ -import postcss from 'postcss'; - -export default postcss.plugin('postcss-system-ui-font', () => root => { - root.walkDecls(propertyRegExp, decl => { - decl.value = decl.value.replace(systemUiMatch, systemUiReplace); - }); -}); +export default function postcssSystemUiFont() { + return { + postcssPlugin: 'postcss-system-ui-font', + Declaration(/** @type {import('postcss').Declaration} */ node) { + if (propertyRegExp.test(node.prop)) { + node.value = node.value.replace(systemUiMatch, systemUiReplace); + } + } + } +} const propertyRegExp = /(?:^(?:-|\\002d){2})|(?:^font(?:-family)?$)/i; const whitespace = '[\\f\\n\\r\\x09\\x20]'; diff --git a/test/basic.autoprefixer.false.expect.css b/test/basic.autoprefixer.false.expect.css index 24b7724..86ddd4c 100644 --- a/test/basic.autoprefixer.false.expect.css +++ b/test/basic.autoprefixer.false.expect.css @@ -3,38 +3,18 @@ } .test-custom-properties { - order: 1; order: var(--order); } -.test-image-set-function { - background-image: url(img/test.png); -} - -@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { - -.test-image-set-function { - background-image: url(img/test-2x.png); -} -} - .test-image-set-function { background-image: image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); order: 2; } -[dir="ltr"] .test-logical-properties-and-values { - margin: 1px 4px 3px 2px; -} - -[dir="rtl"] .test-logical-properties-and-values { - margin: 1px 2px 3px 4px; -} - .test-logical-properties-and-values { + margin: logical 1px 2px 3px 4px; order: 3; - padding-top: 5px; - padding-bottom: 5px; + padding-block: 5px; } .test-nesting-rules { @@ -55,7 +35,7 @@ } } -@media (min-width: 480px) and (max-width: 767px) { +@media (480px <= width < 768px) { .test-media-query-ranges { order: 8; } @@ -76,18 +56,18 @@ order: 9; } -.test-case-insensitive-attributes[frame=hsides],.test-case-insensitive-attributes[frame=Hsides],.test-case-insensitive-attributes[frame=hSides],.test-case-insensitive-attributes[frame=HSides],.test-case-insensitive-attributes[frame=hsIdes],.test-case-insensitive-attributes[frame=HsIdes],.test-case-insensitive-attributes[frame=hSIdes],.test-case-insensitive-attributes[frame=HSIdes],.test-case-insensitive-attributes[frame=hsiDes],.test-case-insensitive-attributes[frame=HsiDes],.test-case-insensitive-attributes[frame=hSiDes],.test-case-insensitive-attributes[frame=HSiDes],.test-case-insensitive-attributes[frame=hsIDes],.test-case-insensitive-attributes[frame=HsIDes],.test-case-insensitive-attributes[frame=hSIDes],.test-case-insensitive-attributes[frame=HSIDes],.test-case-insensitive-attributes[frame=hsidEs],.test-case-insensitive-attributes[frame=HsidEs],.test-case-insensitive-attributes[frame=hSidEs],.test-case-insensitive-attributes[frame=HSidEs],.test-case-insensitive-attributes[frame=hsIdEs],.test-case-insensitive-attributes[frame=HsIdEs],.test-case-insensitive-attributes[frame=hSIdEs],.test-case-insensitive-attributes[frame=HSIdEs],.test-case-insensitive-attributes[frame=hsiDEs],.test-case-insensitive-attributes[frame=HsiDEs],.test-case-insensitive-attributes[frame=hSiDEs],.test-case-insensitive-attributes[frame=HSiDEs],.test-case-insensitive-attributes[frame=hsIDEs],.test-case-insensitive-attributes[frame=HsIDEs],.test-case-insensitive-attributes[frame=hSIDEs],.test-case-insensitive-attributes[frame=HSIDEs],.test-case-insensitive-attributes[frame=hsideS],.test-case-insensitive-attributes[frame=HsideS],.test-case-insensitive-attributes[frame=hSideS],.test-case-insensitive-attributes[frame=HSideS],.test-case-insensitive-attributes[frame=hsIdeS],.test-case-insensitive-attributes[frame=HsIdeS],.test-case-insensitive-attributes[frame=hSIdeS],.test-case-insensitive-attributes[frame=HSIdeS],.test-case-insensitive-attributes[frame=hsiDeS],.test-case-insensitive-attributes[frame=HsiDeS],.test-case-insensitive-attributes[frame=hSiDeS],.test-case-insensitive-attributes[frame=HSiDeS],.test-case-insensitive-attributes[frame=hsIDeS],.test-case-insensitive-attributes[frame=HsIDeS],.test-case-insensitive-attributes[frame=hSIDeS],.test-case-insensitive-attributes[frame=HSIDeS],.test-case-insensitive-attributes[frame=hsidES],.test-case-insensitive-attributes[frame=HsidES],.test-case-insensitive-attributes[frame=hSidES],.test-case-insensitive-attributes[frame=HSidES],.test-case-insensitive-attributes[frame=hsIdES],.test-case-insensitive-attributes[frame=HsIdES],.test-case-insensitive-attributes[frame=hSIdES],.test-case-insensitive-attributes[frame=HSIdES],.test-case-insensitive-attributes[frame=hsiDES],.test-case-insensitive-attributes[frame=HsiDES],.test-case-insensitive-attributes[frame=hSiDES],.test-case-insensitive-attributes[frame=HSiDES],.test-case-insensitive-attributes[frame=hsIDES],.test-case-insensitive-attributes[frame=HsIDES],.test-case-insensitive-attributes[frame=hSIDES],.test-case-insensitive-attributes[frame=HSIDES] { +.test-case-insensitive-attributes[frame=hsides i] { order: 10; } .test-rebeccapurple-color { - color: #639; + color: rebeccapurple; order: 11; } .test-hexadecimal-alpha-notation { - background-color: rgba(243,243,243,0.95294); - color: rgba(0,0,0,0.2); + background-color: #f3f3f3f3; + color: #0003; order: 12; } @@ -97,8 +77,8 @@ } .test-lab-function { - background-color: rgb(178, 34, 34); - color: rgba(178, 34, 34, 0.5); + background-color: lab(40% 56.6 39); + color: lch(40% 68.8 34.5 / 50%); order: 14; } @@ -108,96 +88,11 @@ } .test-font-variant-property { - font-feature-settings: "c2sc"; font-variant-caps: small-caps; order: 16; } .test-all-property { - animation: none 0s ease 0s 1 normal none running; - backface-visibility: visible; - background: transparent none repeat 0 0 / auto auto padding-box border-box scroll; - border: medium none currentColor; - border-collapse: separate; - border-image: none; - border-radius: 0; - border-spacing: 0; - bottom: auto; - box-shadow: none; - box-sizing: content-box; - caption-side: top; - clear: none; - clip: auto; - color: #000; - columns: auto; - column-count: auto; - column-fill: balance; - grid-column-gap: normal; - column-gap: normal; - column-rule: medium none currentColor; - column-span: 1; - column-width: auto; - content: normal; - counter-increment: none; - counter-reset: none; - cursor: auto; - direction: ltr; - display: inline; - empty-cells: show; - float: none; - font-family: serif; - font-size: medium; - font-style: normal; - font-feature-settings: normal; - font-variant: normal; - font-weight: normal; - font-stretch: normal; - line-height: normal; - height: auto; - hyphens: none; - left: auto; - letter-spacing: normal; - list-style: disc outside none; - margin: 0; - max-height: none; - max-width: none; - min-height: 0; - min-width: 0; - opacity: 1; - orphans: 2; - outline: medium none invert; - overflow: visible; - overflow-x: visible; - overflow-y: visible; - padding: 0; - page-break-after: auto; - page-break-before: auto; - page-break-inside: auto; - perspective: none; - perspective-origin: 50% 50%; - position: static; - right: auto; - tab-size: 8; - table-layout: auto; - text-align: left; - text-align-last: auto; - text-decoration: none; - text-indent: 0; - text-shadow: none; - text-transform: none; - top: auto; - transform: none; - transform-origin: 50% 50% 0; - transform-style: flat; - transition: none 0s ease 0s; - unicode-bidi: normal; - vertical-align: baseline; - visibility: visible; - white-space: normal; - widows: 2; - width: auto; - word-spacing: normal; - z-index: auto; all: initial; order: 17; } @@ -206,29 +101,21 @@ order: 18; } -.test-not-pseudo-class:not(:first-child):not(.special) { +.test-not-pseudo-class:not(:first-child, .special) { order: 19; } -.test-any-link-pseudo-class:link,.test-any-link-pseudo-class:visited { - order: 20; -} - .test-any-link-pseudo-class:any-link { order: 20; } -[dir="rtl"] .test-dir-pseudo-class { +.test-dir-pseudo-class:dir(rtl) { order: 21; } .test-overflow-wrap-property { order: 22; - word-wrap: break-word; -} - -.test-focus-visible-pseudo-class.focus-visible { - order: 23; + overflow-wrap: break-word; } .test-focus-visible-pseudo-class:focus-visible { @@ -236,7 +123,6 @@ } .test-double-position-gradients { - background-image: conic-gradient(yellowgreen 40%, gold 0deg, gold 75%, #f06 0deg); background-image: conic-gradient(yellowgreen 40%, gold 0deg 75%, #f06 0deg); } @@ -244,10 +130,6 @@ background-color: yellow; } -.test-has-pseudo-class[\:has\(.inner-class\)] { - background-color: yellow; -} - .test-has-pseudo-class:has(.inner-class) { background-color: yellow; } From ea8c3b5a8a8a98800826e265a713f6c703bb83d9 Mon Sep 17 00:00:00 2001 From: Antonio Laguna Date: Wed, 27 Oct 2021 16:30:50 +0200 Subject: [PATCH 07/12] Release updates (#214) * Updating as per plugin spec See https://github.com/postcss/postcss-font-variant/pull/15 * Adding all property back * Updating System UI plugin to be compatible with PostCSS 8 * Removing no longer existing property * Autoprefixer false doesn't mess with the rest of the file * Updating with up to spec from image set plugin * Using last mod since color-mod was rejected and no longer within pack * Updating main file to be up to PostCSS 8 --- .tape.js | 13 +- package.json | 1 + src/lib/plugins-by-id.js | 2 + src/patch/postcss-system-ui-font-family.js | 6 +- src/postcss.js | 101 ++++++++------- test/basic.autoprefixer.expect.css | 3 +- test/basic.autoprefixer.false.expect.css | 141 +++++++++++++++++++-- test/basic.ch38.expect.css | 15 ++- test/basic.expect.css | 3 +- test/basic.stage0.expect.css | 3 +- test/insert.after.expect.css | 6 +- test/insert.before.expect.css | 4 +- test/insert.css | 6 +- 13 files changed, 216 insertions(+), 88 deletions(-) diff --git a/.tape.js b/.tape.js index fa748df..40df4f4 100644 --- a/.tape.js +++ b/.tape.js @@ -89,29 +89,18 @@ module.exports = { } }, 'insert:after': { - message: 'supports { stage: 1, features: { "color-mod-function": { unresolved: "warn" } }, insertAfter: { "color-mod-function": [ require("postcss-simple-vars")() ] } } usage', + message: 'supports { stage: 1, insertAfter: { "color-mod-function": [ require("postcss-simple-vars")() ] } } usage', options: { stage: 1, - features: { - 'color-mod-function': { - unresolved: 'warn' - } - }, insertAfter: { 'color-mod-function': require('postcss-simple-vars') } }, - warnings: 2 }, 'insert:after:exec': { message: 'supports { stage: 2, features: { "color-mod-function": { unresolved: "ignore" } }, insertAfter: { "color-mod-function": require("postcss-simple-vars")() } } usage', options: { stage: 2, - features: { - 'color-mod-function': { - unresolved: 'ignore' - } - }, insertAfter: { 'color-mod-function': require('postcss-simple-vars')() } diff --git a/package.json b/package.json index 02a9ad0..5cf9971 100644 --- a/package.json +++ b/package.json @@ -52,6 +52,7 @@ "postcss-font-variant": "^5.0.0", "postcss-gap-properties": "^3.0.0", "postcss-image-set-function": "^4.0.0", + "postcss-initial": "^3.0.4", "postcss-lab-function": "^4.0.0", "postcss-logical": "^5.0.0", "postcss-media-minmax": "^5.0.0", diff --git a/src/lib/plugins-by-id.js b/src/lib/plugins-by-id.js index e2a6f12..5c4090e 100644 --- a/src/lib/plugins-by-id.js +++ b/src/lib/plugins-by-id.js @@ -16,6 +16,7 @@ import postcssFontFamilySystemUi from '../patch/postcss-system-ui-font-family'; import postcssGapProperties from 'postcss-gap-properties'; import postcssHasPseudo from 'css-has-pseudo/postcss'; import postcssImageSetPolyfill from 'postcss-image-set-function'; +import postcssInitial from 'postcss-initial'; import postcssLabFunction from 'postcss-lab-function'; import postcssLogical from 'postcss-logical'; import postcssMediaMinmax from 'postcss-media-minmax'; @@ -30,6 +31,7 @@ import postcssSelectorNot from 'postcss-selector-not'; // postcss plugins ordered by id export default { + 'all-property': postcssInitial, 'any-link-pseudo-class': postcssPseudoClassAnyLink, 'blank-pseudo-class': postcssBlankPseudo, 'break-properties': postcssPageBreak, diff --git a/src/patch/postcss-system-ui-font-family.js b/src/patch/postcss-system-ui-font-family.js index 69eb48e..d50cb56 100644 --- a/src/patch/postcss-system-ui-font-family.js +++ b/src/patch/postcss-system-ui-font-family.js @@ -3,12 +3,16 @@ export default function postcssSystemUiFont() { postcssPlugin: 'postcss-system-ui-font', Declaration(/** @type {import('postcss').Declaration} */ node) { if (propertyRegExp.test(node.prop)) { - node.value = node.value.replace(systemUiMatch, systemUiReplace); + if (!node.value.includes(systemUiFamily.join(', '))) { + node.value = node.value.replace(systemUiMatch, systemUiReplace); + } } } } } +postcssSystemUiFont.postcss = true; + const propertyRegExp = /(?:^(?:-|\\002d){2})|(?:^font(?:-family)?$)/i; const whitespace = '[\\f\\n\\r\\x09\\x20]'; const systemUiFamily = [ diff --git a/src/postcss.js b/src/postcss.js index 4ac5888..55ff2fe 100644 --- a/src/postcss.js +++ b/src/postcss.js @@ -1,14 +1,13 @@ -import autoprefixer from 'autoprefixer' +import autoprefixer from 'autoprefixer'; import browserslist from 'browserslist'; import cssdb from 'cssdb'; -import postcss from 'postcss'; import plugins from './lib/plugins-by-id'; import getTransformedInsertions from './lib/get-transformed-insertions'; import getUnsupportedBrowsersByFeature from './lib/get-unsupported-browsers-by-feature'; import idsByExecutionOrder from './lib/ids-by-execution-order'; import writeToExports from './lib/write-to-exports'; -export default postcss.plugin('postcss-preset-env', opts => { +const plugin = opts => { // initialize options const features = Object(Object(opts).features); const insertBefore = Object(Object(opts).insertBefore); @@ -17,13 +16,13 @@ export default postcss.plugin('postcss-preset-env', opts => { const stage = 'stage' in Object(opts) ? opts.stage === false ? 5 - : parseInt(opts.stage) || 0 - : 2; + : parseInt(opts.stage) || 0 + : 2; const autoprefixerOptions = Object(opts).autoprefixer; const sharedOpts = initializeSharedOpts(Object(opts)); const stagedAutoprefixer = autoprefixerOptions === false ? () => {} - : autoprefixer(Object.assign({ overrideBrowserslist: browsers }, autoprefixerOptions)); + : autoprefixer(Object.assign({ overrideBrowserslist: browsers }, autoprefixerOptions)); // polyfillable features (those with an available postcss plugin) const polyfillableFeatures = cssdb.concat( @@ -61,26 +60,35 @@ export default postcss.plugin('postcss-preset-env', opts => { const stagedFeatures = polyfillableFeatures.filter( feature => feature.id in features ? features[feature.id] - : feature.stage >= stage + : feature.stage >= stage ).map( - feature => ({ - browsers: feature.browsers, - plugin: typeof feature.plugin.process === 'function' - ? features[feature.id] === true - ? sharedOpts - // if the plugin is enabled and has shared options - ? feature.plugin(Object.assign({}, sharedOpts)) - // otherwise, if the plugin is enabled - : feature.plugin() - : sharedOpts + feature => { + let options; + let plugin; + + if (features[feature.id] === true) { + // if the plugin is enabled + options = sharedOpts ? Object.assign({}, sharedOpts) : undefined; + } else { + options = sharedOpts // if the plugin has shared options and individual options - ? feature.plugin(Object.assign({}, sharedOpts, features[feature.id])) - // if the plugin has individual options - : feature.plugin(Object.assign({}, features[feature.id])) - // if the plugin is already initialized - : feature.plugin, - id: feature.id - }) + ? Object.assign({}, sharedOpts, features[feature.id]) + // if the plugin has individual options + : Object.assign({}, features[feature.id]); + } + + if (feature.plugin.postcss) { + plugin = feature.plugin(options); + } else { + plugin = feature.plugin; + } + + return { + browsers: feature.browsers, + plugin, + id: feature.id + }; + } ); // browsers supported by the configuration @@ -90,35 +98,28 @@ export default postcss.plugin('postcss-preset-env', opts => { const supportedFeatures = stagedFeatures.filter( feature => feature.id in features ? features[feature.id] - : supportedBrowsers.some( - supportedBrowser => browserslist(feature.browsers, { - ignoreUnknownVersions: true - }).some( - polyfillBrowser => polyfillBrowser === supportedBrowser + : supportedBrowsers.some( + supportedBrowser => browserslist(feature.browsers, { + ignoreUnknownVersions: true + }).some( + polyfillBrowser => polyfillBrowser === supportedBrowser + ) ) - ) ); - return (root, result) => { - // polyfills run in execution order - const polyfills = supportedFeatures.reduce( - (promise, feature) => promise.then( - () => feature.plugin(result.root, result) - ), - Promise.resolve() - ).then( - () => stagedAutoprefixer(result.root, result) - ).then( - () => { - if (Object(opts).exportTo) { - writeToExports(sharedOpts.exportTo, opts.exportTo); - } - } - ) + const usedPlugins = supportedFeatures.map(feature => feature.plugin); + usedPlugins.push(stagedAutoprefixer); - return polyfills; + return { + postcssPlugin: 'postcss-preset-env', + plugins: usedPlugins, + OnceExit: function() { + if ( Object( opts ).exportTo ) { + writeToExports( sharedOpts.exportTo, opts.exportTo ); + } + } }; -}); +} const initializeSharedOpts = opts => { if ('importFrom' in opts || 'exportTo' in opts || 'preserve' in opts) { @@ -145,3 +146,7 @@ const initializeSharedOpts = opts => { return false; }; + +plugin.postcss = true; + +export default plugin; diff --git a/test/basic.autoprefixer.expect.css b/test/basic.autoprefixer.expect.css index 24b7724..98fc6c0 100644 --- a/test/basic.autoprefixer.expect.css +++ b/test/basic.autoprefixer.expect.css @@ -108,7 +108,7 @@ } .test-font-variant-property { - font-feature-settings: "c2sc"; + font-feature-settings: "smcp"; font-variant-caps: small-caps; order: 16; } @@ -132,7 +132,6 @@ columns: auto; column-count: auto; column-fill: balance; - grid-column-gap: normal; column-gap: normal; column-rule: medium none currentColor; column-span: 1; diff --git a/test/basic.autoprefixer.false.expect.css b/test/basic.autoprefixer.false.expect.css index 86ddd4c..98fc6c0 100644 --- a/test/basic.autoprefixer.false.expect.css +++ b/test/basic.autoprefixer.false.expect.css @@ -3,18 +3,38 @@ } .test-custom-properties { + order: 1; order: var(--order); } +.test-image-set-function { + background-image: url(img/test.png); +} + +@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + +.test-image-set-function { + background-image: url(img/test-2x.png); +} +} + .test-image-set-function { background-image: image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); order: 2; } +[dir="ltr"] .test-logical-properties-and-values { + margin: 1px 4px 3px 2px; +} + +[dir="rtl"] .test-logical-properties-and-values { + margin: 1px 2px 3px 4px; +} + .test-logical-properties-and-values { - margin: logical 1px 2px 3px 4px; order: 3; - padding-block: 5px; + padding-top: 5px; + padding-bottom: 5px; } .test-nesting-rules { @@ -35,7 +55,7 @@ } } -@media (480px <= width < 768px) { +@media (min-width: 480px) and (max-width: 767px) { .test-media-query-ranges { order: 8; } @@ -56,18 +76,18 @@ order: 9; } -.test-case-insensitive-attributes[frame=hsides i] { +.test-case-insensitive-attributes[frame=hsides],.test-case-insensitive-attributes[frame=Hsides],.test-case-insensitive-attributes[frame=hSides],.test-case-insensitive-attributes[frame=HSides],.test-case-insensitive-attributes[frame=hsIdes],.test-case-insensitive-attributes[frame=HsIdes],.test-case-insensitive-attributes[frame=hSIdes],.test-case-insensitive-attributes[frame=HSIdes],.test-case-insensitive-attributes[frame=hsiDes],.test-case-insensitive-attributes[frame=HsiDes],.test-case-insensitive-attributes[frame=hSiDes],.test-case-insensitive-attributes[frame=HSiDes],.test-case-insensitive-attributes[frame=hsIDes],.test-case-insensitive-attributes[frame=HsIDes],.test-case-insensitive-attributes[frame=hSIDes],.test-case-insensitive-attributes[frame=HSIDes],.test-case-insensitive-attributes[frame=hsidEs],.test-case-insensitive-attributes[frame=HsidEs],.test-case-insensitive-attributes[frame=hSidEs],.test-case-insensitive-attributes[frame=HSidEs],.test-case-insensitive-attributes[frame=hsIdEs],.test-case-insensitive-attributes[frame=HsIdEs],.test-case-insensitive-attributes[frame=hSIdEs],.test-case-insensitive-attributes[frame=HSIdEs],.test-case-insensitive-attributes[frame=hsiDEs],.test-case-insensitive-attributes[frame=HsiDEs],.test-case-insensitive-attributes[frame=hSiDEs],.test-case-insensitive-attributes[frame=HSiDEs],.test-case-insensitive-attributes[frame=hsIDEs],.test-case-insensitive-attributes[frame=HsIDEs],.test-case-insensitive-attributes[frame=hSIDEs],.test-case-insensitive-attributes[frame=HSIDEs],.test-case-insensitive-attributes[frame=hsideS],.test-case-insensitive-attributes[frame=HsideS],.test-case-insensitive-attributes[frame=hSideS],.test-case-insensitive-attributes[frame=HSideS],.test-case-insensitive-attributes[frame=hsIdeS],.test-case-insensitive-attributes[frame=HsIdeS],.test-case-insensitive-attributes[frame=hSIdeS],.test-case-insensitive-attributes[frame=HSIdeS],.test-case-insensitive-attributes[frame=hsiDeS],.test-case-insensitive-attributes[frame=HsiDeS],.test-case-insensitive-attributes[frame=hSiDeS],.test-case-insensitive-attributes[frame=HSiDeS],.test-case-insensitive-attributes[frame=hsIDeS],.test-case-insensitive-attributes[frame=HsIDeS],.test-case-insensitive-attributes[frame=hSIDeS],.test-case-insensitive-attributes[frame=HSIDeS],.test-case-insensitive-attributes[frame=hsidES],.test-case-insensitive-attributes[frame=HsidES],.test-case-insensitive-attributes[frame=hSidES],.test-case-insensitive-attributes[frame=HSidES],.test-case-insensitive-attributes[frame=hsIdES],.test-case-insensitive-attributes[frame=HsIdES],.test-case-insensitive-attributes[frame=hSIdES],.test-case-insensitive-attributes[frame=HSIdES],.test-case-insensitive-attributes[frame=hsiDES],.test-case-insensitive-attributes[frame=HsiDES],.test-case-insensitive-attributes[frame=hSiDES],.test-case-insensitive-attributes[frame=HSiDES],.test-case-insensitive-attributes[frame=hsIDES],.test-case-insensitive-attributes[frame=HsIDES],.test-case-insensitive-attributes[frame=hSIDES],.test-case-insensitive-attributes[frame=HSIDES] { order: 10; } .test-rebeccapurple-color { - color: rebeccapurple; + color: #639; order: 11; } .test-hexadecimal-alpha-notation { - background-color: #f3f3f3f3; - color: #0003; + background-color: rgba(243,243,243,0.95294); + color: rgba(0,0,0,0.2); order: 12; } @@ -77,8 +97,8 @@ } .test-lab-function { - background-color: lab(40% 56.6 39); - color: lch(40% 68.8 34.5 / 50%); + background-color: rgb(178, 34, 34); + color: rgba(178, 34, 34, 0.5); order: 14; } @@ -88,11 +108,95 @@ } .test-font-variant-property { + font-feature-settings: "smcp"; font-variant-caps: small-caps; order: 16; } .test-all-property { + animation: none 0s ease 0s 1 normal none running; + backface-visibility: visible; + background: transparent none repeat 0 0 / auto auto padding-box border-box scroll; + border: medium none currentColor; + border-collapse: separate; + border-image: none; + border-radius: 0; + border-spacing: 0; + bottom: auto; + box-shadow: none; + box-sizing: content-box; + caption-side: top; + clear: none; + clip: auto; + color: #000; + columns: auto; + column-count: auto; + column-fill: balance; + column-gap: normal; + column-rule: medium none currentColor; + column-span: 1; + column-width: auto; + content: normal; + counter-increment: none; + counter-reset: none; + cursor: auto; + direction: ltr; + display: inline; + empty-cells: show; + float: none; + font-family: serif; + font-size: medium; + font-style: normal; + font-feature-settings: normal; + font-variant: normal; + font-weight: normal; + font-stretch: normal; + line-height: normal; + height: auto; + hyphens: none; + left: auto; + letter-spacing: normal; + list-style: disc outside none; + margin: 0; + max-height: none; + max-width: none; + min-height: 0; + min-width: 0; + opacity: 1; + orphans: 2; + outline: medium none invert; + overflow: visible; + overflow-x: visible; + overflow-y: visible; + padding: 0; + page-break-after: auto; + page-break-before: auto; + page-break-inside: auto; + perspective: none; + perspective-origin: 50% 50%; + position: static; + right: auto; + tab-size: 8; + table-layout: auto; + text-align: left; + text-align-last: auto; + text-decoration: none; + text-indent: 0; + text-shadow: none; + text-transform: none; + top: auto; + transform: none; + transform-origin: 50% 50% 0; + transform-style: flat; + transition: none 0s ease 0s; + unicode-bidi: normal; + vertical-align: baseline; + visibility: visible; + white-space: normal; + widows: 2; + width: auto; + word-spacing: normal; + z-index: auto; all: initial; order: 17; } @@ -101,21 +205,29 @@ order: 18; } -.test-not-pseudo-class:not(:first-child, .special) { +.test-not-pseudo-class:not(:first-child):not(.special) { order: 19; } +.test-any-link-pseudo-class:link,.test-any-link-pseudo-class:visited { + order: 20; +} + .test-any-link-pseudo-class:any-link { order: 20; } -.test-dir-pseudo-class:dir(rtl) { +[dir="rtl"] .test-dir-pseudo-class { order: 21; } .test-overflow-wrap-property { order: 22; - overflow-wrap: break-word; + word-wrap: break-word; +} + +.test-focus-visible-pseudo-class.focus-visible { + order: 23; } .test-focus-visible-pseudo-class:focus-visible { @@ -123,6 +235,7 @@ } .test-double-position-gradients { + background-image: conic-gradient(yellowgreen 40%, gold 0deg, gold 75%, #f06 0deg); background-image: conic-gradient(yellowgreen 40%, gold 0deg 75%, #f06 0deg); } @@ -130,6 +243,10 @@ background-color: yellow; } +.test-has-pseudo-class[\:has\(.inner-class\)] { + background-color: yellow; +} + .test-has-pseudo-class:has(.inner-class) { background-color: yellow; } diff --git a/test/basic.ch38.expect.css b/test/basic.ch38.expect.css index 234ae12..286e861 100644 --- a/test/basic.ch38.expect.css +++ b/test/basic.ch38.expect.css @@ -7,6 +7,17 @@ order: var(--order); } +.test-image-set-function { + background-image: url(img/test.png); +} + +@media (min-resolution: 192dpi) { + +.test-image-set-function { + background-image: url(img/test-2x.png); +} +} + .test-image-set-function { background-image: -webkit-image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); background-image: image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x); @@ -98,8 +109,8 @@ } .test-font-variant-property { - -webkit-font-feature-settings: "c2sc"; - font-feature-settings: "c2sc"; + -webkit-font-feature-settings: "smcp"; + font-feature-settings: "smcp"; font-variant-caps: small-caps; order: 16; } diff --git a/test/basic.expect.css b/test/basic.expect.css index bbeb6e3..d2147fe 100644 --- a/test/basic.expect.css +++ b/test/basic.expect.css @@ -109,7 +109,7 @@ } .test-font-variant-property { - font-feature-settings: "c2sc"; + font-feature-settings: "smcp"; font-variant-caps: small-caps; order: 16; } @@ -139,7 +139,6 @@ column-count: auto; -moz-column-fill: balance; column-fill: balance; - grid-column-gap: normal; -moz-column-gap: normal; column-gap: normal; -moz-column-rule: medium none currentColor; diff --git a/test/basic.stage0.expect.css b/test/basic.stage0.expect.css index c419c2f..dc8cfe9 100644 --- a/test/basic.stage0.expect.css +++ b/test/basic.stage0.expect.css @@ -113,7 +113,7 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te } .test-font-variant-property { - font-feature-settings: "c2sc"; + font-feature-settings: "smcp"; font-variant-caps: small-caps; order: 16; } @@ -143,7 +143,6 @@ h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.te column-count: auto; -moz-column-fill: balance; column-fill: balance; - grid-column-gap: normal; -moz-column-gap: normal; column-gap: normal; -moz-column-rule: medium none currentColor; diff --git a/test/insert.after.expect.css b/test/insert.after.expect.css index 611769c..f58436e 100644 --- a/test/insert.after.expect.css +++ b/test/insert.after.expect.css @@ -1,3 +1,5 @@ -test-css-color-modifying-colors { - color: color-mod(#639 alpha(80%)); +$font: system-ui; + +.test-variable { + font-family: $font; } diff --git a/test/insert.before.expect.css b/test/insert.before.expect.css index a31f12d..4952078 100644 --- a/test/insert.before.expect.css +++ b/test/insert.before.expect.css @@ -1,3 +1,3 @@ -test-css-color-modifying-colors { - color: rgba(102, 51, 153, 0.8); +.test-variable { + font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif; } diff --git a/test/insert.css b/test/insert.css index 12d2d1a..f58436e 100644 --- a/test/insert.css +++ b/test/insert.css @@ -1,5 +1,5 @@ -$color: rebeccapurple; +$font: system-ui; -test-css-color-modifying-colors { - color: color-mod($color alpha(80%)); +.test-variable { + font-family: $font; } From f2ee0c6611bb3f9daddb8cd83c73d54c3faee7fb Mon Sep 17 00:00:00 2001 From: Romain Menke <11521496+romainmenke@users.noreply.github.com> Date: Fri, 29 Oct 2021 14:42:11 +0200 Subject: [PATCH 08/12] Update package.json (#218) --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 5cf9971..552c4c9 100644 --- a/package.json +++ b/package.json @@ -46,7 +46,7 @@ "postcss-custom-selectors": "^6.0.0", "postcss-dir-pseudo-class": "^6.0.0", "postcss-double-position-gradients": "^3.0.0", - "postcss-env-function": "^4.0.0", + "postcss-env-function": "^4.0.1", "postcss-focus-visible": "^6.0.1", "postcss-focus-within": "^5.0.1", "postcss-font-variant": "^5.0.0", From 4239d6066a3ee6f1839027c3a78c7fcb3ba35951 Mon Sep 17 00:00:00 2001 From: Jonathan Neal Date: Fri, 29 Oct 2021 08:44:51 -0400 Subject: [PATCH 09/12] update dependencies --- package.json | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index 552c4c9..d08ca47 100644 --- a/package.json +++ b/package.json @@ -29,14 +29,14 @@ "postcss": "^8.3" }, "dependencies": { - "autoprefixer": "^10.3.5", - "browserslist": "^4.17.1", - "caniuse-lite": "^1.0.30001259", + "autoprefixer": "^10.4.0", + "browserslist": "^4.17.5", + "caniuse-lite": "^1.0.30001272", "css-blank-pseudo": "^2.0.0", "css-has-pseudo": "^2.0.0", "css-prefers-color-scheme": "^5.0.0", "cssdb": "^5.0.0", - "postcss": "^8.3.7", + "postcss": "^8.3", "postcss-attribute-case-insensitive": "^5.0.0", "postcss-color-functional-notation": "^4.0.0", "postcss-color-hex-alpha": "^8.0.0", @@ -56,7 +56,7 @@ "postcss-lab-function": "^4.0.0", "postcss-logical": "^5.0.0", "postcss-media-minmax": "^5.0.0", - "postcss-nesting": "^8.0.1", + "postcss-nesting": "^9.0.0", "postcss-overflow-shorthand": "^3.0.0", "postcss-page-break": "^3.0.4", "postcss-place": "^7.0.0", @@ -65,13 +65,13 @@ "postcss-selector-not": "^5.0.0" }, "devDependencies": { - "@babel/core": "^7.15.5", - "@babel/preset-env": "^7.15.6", - "eslint": "^7.32.0", + "@babel/core": "^7.15.8", + "@babel/preset-env": "^7.15.8", + "eslint": "^8.1.0", "postcss-simple-vars": "^6.0.3", "postcss-tape": "^6.0.1", "pre-commit": "^1.2.2", - "rollup": "^2.57.0", + "rollup": "^2.58.3", "rollup-plugin-babel": "^4.4.0" }, "babel": { From d16f681f7f3e1cfa1022994d9d7e5f33329a4d37 Mon Sep 17 00:00:00 2001 From: romainmenke Date: Wed, 3 Nov 2021 13:40:39 +0100 Subject: [PATCH 10/12] update tests for nesting --- test/basic.nesting.expect.css | 5 ----- test/basic.stage0-ff49.expect.css | 5 ----- test/basic.stage0.expect.css | 5 ----- 3 files changed, 15 deletions(-) diff --git a/test/basic.nesting.expect.css b/test/basic.nesting.expect.css index a30c323..e330ef5 100644 --- a/test/basic.nesting.expect.css +++ b/test/basic.nesting.expect.css @@ -26,11 +26,6 @@ order: 5; } -.test-nesting-rules { - - order: 6; -} - @custom-media --narrow-window (max-width: 30em); @media (--narrow-window) { diff --git a/test/basic.stage0-ff49.expect.css b/test/basic.stage0-ff49.expect.css index 79fe510..b68fe33 100644 --- a/test/basic.stage0-ff49.expect.css +++ b/test/basic.stage0-ff49.expect.css @@ -36,11 +36,6 @@ order: 5; } -.test-nesting-rules { - - order: 6; -} - @media (max-width: 30em) { .test-custom-media-queries { order: 7; diff --git a/test/basic.stage0.expect.css b/test/basic.stage0.expect.css index dc8cfe9..adac4a6 100644 --- a/test/basic.stage0.expect.css +++ b/test/basic.stage0.expect.css @@ -46,11 +46,6 @@ order: 5; } -.test-nesting-rules { - - order: 6; -} - @media (max-width: 30em) { .test-custom-media-queries { order: 7; From 45b8aa031903c0860dfd51fc4db2a8e24f37c9dc Mon Sep 17 00:00:00 2001 From: Antonio Laguna Date: Tue, 16 Nov 2021 06:53:36 +0100 Subject: [PATCH 11/12] Custom selectors changed output Given it's a custom selector, postcss-nesting does not handle that case and produces unneeded (but harmless) `:is` code. --- test/import.expect.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/import.expect.css b/test/import.expect.css index ded9c5e..458b065 100644 --- a/test/import.expect.css +++ b/test/import.expect.css @@ -9,7 +9,7 @@ } } -h1.test-custom-selectors,h2.test-custom-selectors,h3.test-custom-selectors,h4.test-custom-selectors,h5.test-custom-selectors,h6.test-custom-selectors { +.test-custom-selectors:is(h1),.test-custom-selectors:is(h2),.test-custom-selectors:is(h3),.test-custom-selectors:is(h4),.test-custom-selectors:is(h5),.test-custom-selectors:is(h6) { order: 3; } From 797f91728078ddb4bd79c4ee7dc0c06d68021b2c Mon Sep 17 00:00:00 2001 From: Antonio Laguna Date: Tue, 16 Nov 2021 13:11:11 +0100 Subject: [PATCH 12/12] Upgrade postcss-nesting --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index d08ca47..120e8c6 100644 --- a/package.json +++ b/package.json @@ -56,7 +56,7 @@ "postcss-lab-function": "^4.0.0", "postcss-logical": "^5.0.0", "postcss-media-minmax": "^5.0.0", - "postcss-nesting": "^9.0.0", + "postcss-nesting": "^10.0.0", "postcss-overflow-shorthand": "^3.0.0", "postcss-page-break": "^3.0.4", "postcss-place": "^7.0.0",