From 50ac8349906d977cd4ef4c4420bdf37e1b9f921a Mon Sep 17 00:00:00 2001
From: Seth Falco <seth@falco.fun>
Date: Fri, 10 Nov 2023 14:50:03 +0000
Subject: [PATCH] docs: revise documentation for various plugins

---
 docs/03-plugins/inline-styles.mdx                 |  2 +-
 docs/03-plugins/remove-attributes-by-selector.mdx |  2 +-
 docs/03-plugins/remove-comments.mdx               |  4 ++++
 docs/03-plugins/remove-empty-text.mdx             |  6 +++---
 docs/03-plugins/remove-hidden-elems.mdx           |  2 +-
 .../03-plugins/remove-useless-stroke-and-fill.mdx |  2 +-
 lib/style.js                                      | 15 +++++++++------
 plugins/inlineStyles.js                           |  4 ++--
 8 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/docs/03-plugins/inline-styles.mdx b/docs/03-plugins/inline-styles.mdx
index 323050ebf..764acb418 100644
--- a/docs/03-plugins/inline-styles.mdx
+++ b/docs/03-plugins/inline-styles.mdx
@@ -16,7 +16,7 @@ svgo:
       description: What pseudo-classes and pseudo-elements to use. An empty string signifies all non-pseudo-classes and non-pseudo-elements. 
 ---
 
-Move and merge styles from `<style>` elements to a respective elements `style` attributes.
+Merges styles from `<style>` elements to the `style` attribute of matching elements.
 
 ## Usage
 
diff --git a/docs/03-plugins/remove-attributes-by-selector.mdx b/docs/03-plugins/remove-attributes-by-selector.mdx
index dd8b0389e..4e26c90b1 100644
--- a/docs/03-plugins/remove-attributes-by-selector.mdx
+++ b/docs/03-plugins/remove-attributes-by-selector.mdx
@@ -4,7 +4,7 @@ svgo:
   pluginId: removeAttributesBySelector
   parameters:
     selectors:
-      description: This is an array of objects with two properties, <code>selector</code>, and <code>attributes</code>, which represent a CSS selector and the attributes to remove respectively.
+      description: An array of objects with two properties, <code>selector</code>, and <code>attributes</code>, which represent a CSS selector and the attributes to remove respectively.
       default: null
 ---
 
diff --git a/docs/03-plugins/remove-comments.mdx b/docs/03-plugins/remove-comments.mdx
index 3c2a6fe8f..c1bb83fdb 100644
--- a/docs/03-plugins/remove-comments.mdx
+++ b/docs/03-plugins/remove-comments.mdx
@@ -28,6 +28,10 @@ Removing a comment like this may be considered a breach of the license terms, as
 
 <PluginUsage/>
 
+### Parameters
+
+<PluginParams/>
+
 ## Demo
 
 <PluginDemo/>
diff --git a/docs/03-plugins/remove-empty-text.mdx b/docs/03-plugins/remove-empty-text.mdx
index 389d4df9f..67080a7fa 100644
--- a/docs/03-plugins/remove-empty-text.mdx
+++ b/docs/03-plugins/remove-empty-text.mdx
@@ -5,13 +5,13 @@ svgo:
   defaultPlugin: true
   parameters:
     text:
-      description: Removes empty <a href="https://developer.mozilla.org/docs/Web/SVG/Element/text" target="_blank"><code>&lt;text&gt;</code></a> elements.
+      description: If to remove empty <a href="https://developer.mozilla.org/docs/Web/SVG/Element/text" target="_blank"><code>&lt;text&gt;</code></a> elements.
       default: true
     tspan:
-      description: Removes empty <a href="https://developer.mozilla.org/docs/Web/SVG/Element/tspan" target="_blank"><code>&lt;tspan&gt;</code></a> elements.
+      description: If to remove empty <a href="https://developer.mozilla.org/docs/Web/SVG/Element/tspan" target="_blank"><code>&lt;tspan&gt;</code></a> elements.
       default: true
     tref:
-      description: Removes empty <a href="https://developer.mozilla.org/docs/Web/SVG/Element/tref" target="_blank"><code>&lt;tref&gt;</code></a> elements.
+      description: If to remove empty <a href="https://developer.mozilla.org/docs/Web/SVG/Element/tref" target="_blank"><code>&lt;tref&gt;</code></a> elements.
       default: true
 ---
 
diff --git a/docs/03-plugins/remove-hidden-elems.mdx b/docs/03-plugins/remove-hidden-elems.mdx
index dc6a64a2e..a61a886d6 100644
--- a/docs/03-plugins/remove-hidden-elems.mdx
+++ b/docs/03-plugins/remove-hidden-elems.mdx
@@ -55,7 +55,7 @@ Remove hidden or invisible elements from the document. This can be elements with
 
 This plugin ignores non-rendering elements, such as [`<clipPath>`](https://developer.mozilla.org/docs/Web/SVG/Element/clipPath) and [`<linearGradient>`](https://developer.mozilla.org/docs/Web/SVG/Element/linearGradient), which still apply regardless of styles, unless they are unused.
 
-Refer to the paremeters for the conditions this plugin looks for. All checks enabled by default.
+Refer to the parameters for the conditions this plugin looks for. All checks enabled by default.
 
 ## Usage
 
diff --git a/docs/03-plugins/remove-useless-stroke-and-fill.mdx b/docs/03-plugins/remove-useless-stroke-and-fill.mdx
index 4e884f978..159b514b0 100644
--- a/docs/03-plugins/remove-useless-stroke-and-fill.mdx
+++ b/docs/03-plugins/remove-useless-stroke-and-fill.mdx
@@ -17,7 +17,7 @@ svgo:
 
 Removes useless `stroke` and `fill` attributes.
 
-Assigning these attributes can sometimes change nothing in the document. For example, in most cases assigning a `stoke` color is redundant if the elements [`stroke-width`](https://developer.mozilla.org/docs/Web/SVG/Attribute/stroke-width) or [`stroke-opacity`](https://developer.mozilla.org/docs/Web/SVG/Attribute/stroke-opacity) is `0`.
+Assigning these attributes can sometimes change nothing in the document. For example, in most cases assigning a `stroke` color is redundant if the elements [`stroke-width`](https://developer.mozilla.org/docs/Web/SVG/Attribute/stroke-width) or [`stroke-opacity`](https://developer.mozilla.org/docs/Web/SVG/Attribute/stroke-opacity) is `0`.
 
 ## Usage
 
diff --git a/lib/style.js b/lib/style.js
index aefde3241..865daf299 100644
--- a/lib/style.js
+++ b/lib/style.js
@@ -278,17 +278,20 @@ const computeStyle = (stylesheet, node) => {
 exports.computeStyle = computeStyle;
 
 /**
- * Determines if the given CSS selector references the given attribute.
+ * Determines if the CSS selector references the given attribute.
  *
  * @param {csstree.ListItem<csstree.CssNode>|string} selector
  * @param {string} attr
  * @returns {boolean}
  * @see https://developer.mozilla.org/docs/Web/CSS/Attribute_selectors
  */
-const containsAttrSelector = (selector, attr) => {
-  const body =
-    typeof selector === 'string' ? selector : csstree.generate(selector.data);
+const includesAttrSelector = (selector, attr) => {
+  const attrSelectorPattern = new RegExp(`\\[\\s*${attr}\\s*[\\]=~|^$*]`, 'i');
 
-  return new RegExp(`\\[\\s*${attr}`).test(body);
+  if (typeof selector === 'string') {
+    return attrSelectorPattern.test(attr);
+  }
+
+  return attrSelectorPattern.test(csstree.generate(selector.data));
 };
-exports.containsAttrSelector = containsAttrSelector;
+exports.includesAttrSelector = includesAttrSelector;
diff --git a/plugins/inlineStyles.js b/plugins/inlineStyles.js
index 70de9fd8a..db6bd2350 100644
--- a/plugins/inlineStyles.js
+++ b/plugins/inlineStyles.js
@@ -15,7 +15,7 @@ const {
   querySelectorAll,
   detachNodeFromParent,
 } = require('../lib/xast.js');
-const { compareSpecificity, containsAttrSelector } = require('../lib/style');
+const { compareSpecificity, includesAttrSelector } = require('../lib/style');
 const { attrsGroups } = require('./_collections');
 
 exports.name = 'inlineStyles';
@@ -222,7 +222,7 @@ exports.fn = (root, params) => {
                 if (
                   attrsGroups.presentation.includes(property) &&
                   !selectors.some((selector) =>
-                    containsAttrSelector(selector.item, property)
+                    includesAttrSelector(selector.item, property)
                   )
                 ) {
                   delete selectedEl.attributes[property];