Merge pull request #120 from KevinBatdorf/remove-unecessary-escape

Remove unecessary escape

Author: KevinBatdorf

.eslintrc

@@ -48,6 +48,7 @@
 		"quote-props": ["error", "as-needed"],
 		"no-multiple-empty-lines": ["error", { "max": 1 }],
 		"@typescript-eslint/no-var-requires": "off",
+		"@typescript-eslint/no-require-imports": "off",
 		"lines-around-comment": [
 			"error",
 			{

cypress/e2e/block.cy.js

@@ -310,7 +310,7 @@ context('Pattern Css', () => {
 				.invoke('text')
 				.should(
 					'contain',
-					'background-image:url(https://foo.com/bar.jpg?</style><script>alert\\(1\\)</script>)',
+					'background-image:url(https://foo.com/bar.jpg?</style><script>alert\\(1\\)</script>)',
 				);
 		});
 	});

package-lock.json

@@ -20,17 +20,17 @@
 		"@trivago/prettier-plugin-sort-imports": "^4.3.0",
 		"@types/wordpress__block-editor": "^11.5.15",
 		"@types/wordpress__blocks": "^12.5.14",
-		"@types/wordpress__edit-post": "^7.5.7",
-		"@types/wordpress__editor": "^13.6.8",
-		"@types/wordpress__plugins": "^3.0.3",
-		"@typescript-eslint/eslint-plugin": "^7.16.1",
-		"@typescript-eslint/parser": "^7.16.1",
-		"@wordpress/block-editor": "^13.3.0",
-		"@wordpress/env": "^10.3.0",
-		"@wordpress/scripts": "^28.3.0",
-		"@wordpress/url": "^4.3.0",
-		"autoprefixer": "^10.4.19",
-		"cypress": "^13.13.1",
+		"@types/wordpress__edit-post": "^8.4.0",
+		"@types/wordpress__editor": "^14.3.0",
+		"@types/wordpress__plugins": "^6.0.0",
+		"@typescript-eslint/eslint-plugin": "^8.6.0",
+		"@typescript-eslint/parser": "^8.6.0",
+		"@wordpress/block-editor": "^14.3.0",
+		"@wordpress/env": "^10.8.0",
+		"@wordpress/scripts": "^30.0.2",
+		"@wordpress/url": "^4.8.0",
+		"autoprefixer": "^10.4.20",
+		"cypress": "^13.14.2",
 		"cypress-wait-until": "^3.0.2",
 		"eslint": "^8.57.0",
 		"eslint-config-prettier": "^9.1.0",
@@ -45,23 +45,23 @@
 		"postcss-safe-important": "^2.0.1",
 		"prettier": "^3.3.3",
 		"replace-in-file": "^8.1.0",
-		"tailwindcss": "^3.4.6",
-		"typescript": "^5.5.3"
+		"tailwindcss": "^3.4.12",
+		"typescript": "^5.6.2"
 	},
 	"dependencies": {
-		"@wordpress/block-editor": "^13.3.0",
-		"@wordpress/blocks": "^13.3.0",
-		"@wordpress/edit-post": "^8.3.0",
-		"@wordpress/editor": "^14.3.0",
-		"@wordpress/element": "^6.3.0",
-		"@wordpress/i18n": "^5.3.0",
-		"@wordpress/plugins": "^7.3.0",
+		"@wordpress/block-editor": "^14.3.0",
+		"@wordpress/blocks": "^13.8.0",
+		"@wordpress/edit-post": "^8.8.3",
+		"@wordpress/editor": "^14.8.3",
+		"@wordpress/element": "^6.8.0",
+		"@wordpress/i18n": "^5.8.0",
+		"@wordpress/plugins": "^7.8.0",
 		"browserlist": "^1.0.1",
-		"lightningcss": "1.25.1",
-		"lightningcss-wasm": "1.25.1",
+		"lightningcss": "1.27.0",
+		"lightningcss-wasm": "1.27.0",
 		"react-simple-code-editor": "^0.14.1",
 		"shiki": "^0.14.7",
 		"swr": "^2.2.5",
-		"zustand": "^4.5.4"
+		"zustand": "^4.5.5"
 	}
 }

package.json

@@ -4,7 +4,7 @@
  * Description:       Lightening Fast, Safe, In-editor CSS Optimization and Minification Tool
  * Requires at least: 6.0
  * Requires PHP:      7.0
- * Version:           1.2.5
+ * Version:           1.2.6
  * Author:            Kevin Batdorf
  * Author URI:        https://twitter.com/kevinbatdorf
  * License:           GPL-2.0-or-later

pattern-css.php

@@ -8,7 +8,7 @@ module.exports = ({ mode }) => ({
 		(css) =>
 			css.walkRules((rule) => {
 				// Removes top level TW styles like *::before {}
-				rule.selector.startsWith('*') && rule.remove();
+				if (rule.selector.startsWith('*')) rule.remove();
 			}),
 		// See: https://github.com/WordPress/gutenberg/blob/trunk/packages/postcss-plugins-preset/lib/index.js
 		require('autoprefixer')({ grid: true }),

postcss.config.js

@@ -2,7 +2,7 @@
 Contributors:      kbat82
 Tags:              css, styles, inline, margin, pattern
 Tested up to:      6.6
-Stable tag:        1.2.5
+Stable tag:        1.2.6
 License:           GPL-2.0-or-later
 License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 
@@ -131,6 +131,9 @@ Add this to functions.php:
 
 == Changelog ==
 
+= 1.2.6 - 2024-09-20 =
+- Removes an unecessary html escape that mangled some css.
+
 = 1.2.5 - 2024-07-28 =
 - Fixed a small bug where a block may not have attributes when we access them.
 

readme.txt

@@ -16,14 +16,14 @@ import {
 	useRef,
 } from '@wordpress/element';
 import { useSelect } from '@wordpress/data';
-import { escapeHTML } from '@wordpress/escape-html';
 import { sprintf, __ } from '@wordpress/i18n';
 import { Warning as CssWarning, Rule } from 'lightningcss-wasm';
 import { CodeEditor } from './CodeEditor';
 import { focusAtEndOfLine2 } from '../lib/dom';
 import { EditorControls } from './EditorControls';
 import { store as coreStore } from '@wordpress/editor';
 import { addToClassList } from '../lib/classes';
+import { escapeCSS } from '../lib/formatting';
 
 export const BlockControl = (
 	// eslint-disable-next-line
@@ -54,14 +54,13 @@ export const BlockControl = (
 	const defaultCssExample = '[block] {\n  \n}';
 
 	const handleChange = useCallback(
-		(value?: string) => {
-			if (value === undefined) {
+		(css?: string) => {
+			if (css === undefined) {
 				setCss(undefined);
 				return;
 			}
-			const css = escapeHTML(value);
 			setWarnings([]);
-			setCss(css);
+			setCss(escapeCSS(css));
 
 			if (!window.patternCss?.transform) return;
 
@@ -197,9 +196,11 @@ export const BlockControl = (
 			: document.createElement('style');
 		style.id = id;
 		style.innerHTML = compiled;
-		frame?.document?.head
-			? frame.document.head.appendChild(style)
-			: parent.appendChild(style);
+		if (frame?.document?.head) {
+			frame.document.head.appendChild(style);
+		} else {
+			parent.appendChild(style);
+		}
 	}, [compiled, pcssClassId]);
 
 	return (

src/components/BlockControl.tsx

@@ -0,0 +1,6 @@
+export const escapeCSS = (url: string) =>
+	url
+		.replace(/<\s*script\s*>/gi, '&lt;script&gt;')
+		.replace(/<\s*\/\s*script\s*>/gi, '&lt;/script&gt;')
+		.replace(/<\s*style\s*>/gi, '&lt;style&gt;')
+		.replace(/<\s*\/\s*style\s*>/gi, '&lt;/style&gt;');