CSS Blank Pseudo (#486)

* WIP

* Tests and docs

* Rewriting browser

* Browser tests running

* Touch to docs

* Finishing

* Minor updates

* Moving the file to be `.mjs

* Linted now

* css-blank-pseudo : code review (#501)

Co-authored-by: Romain Menke <11521496+romainmenke@users.noreply.github.com>

Author: Antonio-Laguna

plugins/css-blank-pseudo/.gitignore

@@ -1,15 +1,6 @@
 node_modules
-dist
 package-lock.json
 yarn.lock
-browser.js
-!src/browser.js
-browser-legacy.js
-*.log*
 *.result.css
 *.result.css.map
-!.editorconfig
-!.gitignore
-!.rollup.js
-!.tape.js
-!.travis.yml
+dist/*

plugins/css-blank-pseudo/.tape.mjs

@@ -17,11 +17,35 @@ postcssTape(plugin)({
 			preserve: false
 		}
 	},
-	'generated-selector-cases': {
-		message: 'correctly handles generated cases',
+	'basic:wrong-replacewith': {
+		message: 'correctly warns when replace with is invalid',
 		warnings: 1,
+		options: {
+			replaceWith: '#css-blank'
+		}
+	},
+	'examples/example': {
+		message: 'minimal example',
+	},
+	'examples/example:preserve-false': {
+		message: 'minimal example',
 		options: {
 			preserve: false
 		}
 	},
+	'examples/example:replacewith': {
+		message: 'minimal example',
+		options: {
+			replaceWith: '.css-blank'
+		}
+	},
+	'browser': {
+		message: 'css for browser tests',
+	},
+	'browser:replacewith': {
+		message: 'css for browser tests',
+		options: {
+			replaceWith: '.css-blank'
+		}
+	},
 });

plugins/css-blank-pseudo/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Changes to CSS Blank Pseudo
 
+### Unreleased (major)
+
+- Updated: The polyfill now only attaches a single listener to the body so it's
+more efficient and also does less work at the MutationObserver handler.
+- Breaking: removed old CDN urls
+- Breaking: removed old CLI
+
+#### How to migrate:
+
+- If you use a CDN url, please update it.
+- Re-build your CSS with the new version of the library.
+
+```diff
+- <script src="https://unpkg.com/css-blank-pseudo/browser"></script>
+- <script src="https://unpkg.com/css-blank-pseudo/browser.min"></script>
++ <script src="https://unpkg.com/css-blank-pseudo/dist/browser-global.js"></script>
+```
+
+```diff
+- cssBlankPseudo(document)
++ cssBlankPseudoInit()
+```
+
 ### 3.0.3 (February 5, 2022)
 
 - Rebuild of browser polyfills

plugins/css-blank-pseudo/INSTALL.md

@@ -1,13 +1,13 @@
-# Installing CSS Blank Pseudo
+# Installing PostCSS Blank Pseudo
 
-[CSS Blank Pseudo] runs in all Node environments, with special instructions for:
+[PostCSS Blank Pseudo] runs in all Node environments, with special instructions for:
 
 | [Node](#node) | [PostCSS CLI](#postcss-cli) | [Webpack](#webpack) | [Create React App](#create-react-app) | [Gulp](#gulp) | [Grunt](#grunt) |
 | --- | --- | --- | --- | --- | --- |
 
 ## Node
 
-Add [CSS Blank Pseudo] to your project:
+Add [PostCSS Blank Pseudo] to your project:
 
 ```bash
 npm install postcss css-blank-pseudo --save-dev
@@ -32,7 +32,7 @@ Add [PostCSS CLI] to your project:
 npm install postcss-cli css-blank-pseudo --save-dev
 ```
 
-Use [CSS Blank Pseudo] in your `postcss.config.js` configuration file:
+Use [PostCSS Blank Pseudo] in your `postcss.config.js` configuration file:
 
 ```js
 const postcssBlankPseudo = require('css-blank-pseudo');
@@ -54,7 +54,7 @@ Add [PostCSS Loader] to your project:
 npm install postcss-loader css-blank-pseudo --save-dev
 ```
 
-Use [CSS Blank Pseudo] in your Webpack configuration:
+Use [PostCSS Blank Pseudo] in your Webpack configuration:
 
 ```js
 module.exports = {
@@ -98,7 +98,7 @@ Add [React App Rewired] and [React App Rewire PostCSS] to your project:
 npm install react-app-rewired react-app-rewire-postcss css-blank-pseudo --save-dev
 ```
 
-Use [React App Rewire PostCSS] and [CSS Blank Pseudo] in your
+Use [React App Rewire PostCSS] and [PostCSS Blank Pseudo] in your
 `config-overrides.js` file:
 
 ```js
@@ -120,7 +120,7 @@ Add [Gulp PostCSS] to your project:
 npm install gulp-postcss css-blank-pseudo --save-dev
 ```
 
-Use [CSS Blank Pseudo] in your Gulpfile:
+Use [PostCSS Blank Pseudo] in your Gulpfile:
 
 ```js
 const postcss = require('gulp-postcss');
@@ -145,7 +145,7 @@ Add [Grunt PostCSS] to your project:
 npm install grunt-postcss css-blank-pseudo --save-dev
 ```
 
-Use [CSS Blank Pseudo] in your Gruntfile:
+Use [PostCSS Blank Pseudo] in your Gruntfile:
 
 ```js
 const postcssBlankPseudo = require('css-blank-pseudo');
@@ -171,6 +171,6 @@ grunt.initConfig({
 [PostCSS]: https://github.com/postcss/postcss
 [PostCSS CLI]: https://github.com/postcss/postcss-cli
 [PostCSS Loader]: https://github.com/postcss/postcss-loader
-[CSS Blank Pseudo]: https://github.com/csstools/postcss-plugins/tree/main/plugins/css-blank-pseudo
+[PostCSS Blank Pseudo]: https://github.com/csstools/postcss-plugins/tree/main/plugins/css-blank-pseudo
 [React App Rewire PostCSS]: https://github.com/csstools/react-app-rewire-postcss
 [React App Rewired]: https://github.com/timarney/react-app-rewired