Feat: add tilde attribute selector (ref #26) (#42)

JPeer264 · Apr 28, 2018 · e4b8b93 · e4b8b93
1 parent 2c0dbfd
commit e4b8b93
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 2 deletions.
diff --git a/lib/replace/regex.js b/lib/replace/regex.js
@@ -1,6 +1,6 @@
 export default {
   selectors: /(#|\.)[^\s:.{)[>+,\s]+/g, // matches all selectors beginning with . or # - e.g. .matching#alsomatch .matchmetoo
   strings: /"\s*[\S\s]*?\s*"|'\s*[\S\s]*?\s*'/g, // matches strings such as: 'hello' or "hello"
-  attributeSelectors: /\[\s*(class|id)\s*([*^$|]?)=\s*("[\s\S]*?"|'[\s\S]*?'|[\s\S]*)[\s\S]*?\]/g, // matches attribute selectors of html just with class or id in it with `$=`, `^=` or `*=`, e.g.: [class*="selector"]. 3 group matches, first `class` or `id`, second regex operator, third the string
+  attributeSelectors: /\[\s*(class|id)\s*([*^$|~]?)=\s*("[\s\S]*?"|'[\s\S]*?'|[\s\S]*)[\s\S]*?\]/g, // matches attribute selectors of html just with class or id in it with `$=`, `^=` or `*=`, e.g.: [class*="selector"]. 3 group matches, first `class` or `id`, second regex operator, third the string
   keyframes: /@(-[a-z]*-)*keyframes\s+([a-zA-Z0-9_-]+)/g, // matches keyframes and just the first group the first matched non-whitespace characters - e.g. matches: `@keyframes    my-KeyFra_me`
 };
diff --git a/lib/selectorLibrary.js b/lib/selectorLibrary.js
@@ -394,7 +394,7 @@ class SelectorLibrary {
         }
       }
 
-      if (attributeSelector.charAt(1) === '=' || attributeSelector.charAt(1) === '|') {
+      if (attributeSelector.charAt(1).match(/^[=~|]/)) {
         const match = slicedSelector.match(attributeString);
 
         if (match && slicedSelector === match[0]) {

diff --git a/test/selectorLibrary.js b/test/selectorLibrary.js
@@ -426,6 +426,17 @@ test('setAttributeSelector | should set attribute selectors correctly', (t) => {
   t.is(rcs.selectorLibrary.attributeSelectors['#^header'].originalString, '[id^="header"]');
 });
 
+test('setAttributeSelector | should set attribute selectors correctly', (t) => {
+  rcs.selectorLibrary.setAttributeSelector('[class~="test"]');
+  rcs.selectorLibrary.setAttributeSelector('[id~="test"]');
+
+  t.is(Object.keys(rcs.selectorLibrary.attributeSelectors).length, 2);
+  t.is(typeof rcs.selectorLibrary.attributeSelectors['.~test'], 'object');
+  t.is(rcs.selectorLibrary.attributeSelectors['.~test'].originalString, '[class~="test"]');
+  t.is(typeof rcs.selectorLibrary.attributeSelectors['#~test'], 'object');
+  t.is(rcs.selectorLibrary.attributeSelectors['#~test'].originalString, '[id~="test"]');
+});
+
 test('setAttributeSelector | should do nothing', (t) => {
   rcs.selectorLibrary.setAttributeSelector([
     'ewe weo',
@@ -517,6 +528,16 @@ test('replaceAttributeSelector | should return the correct multi selector', (t)
   t.is(rcs.selectorLibrary.replaceAttributeSelector('#nix'), false);
 });
 
+test('replaceAttributeSelector | should return the correct tilde selector', (t) => {
+  rcs.selectorLibrary.setAttributeSelector('[id~=tilde]');
+
+  t.is(rcs.selectorLibrary.replaceAttributeSelector('#tilde'), '#tilde');
+  t.is(rcs.selectorLibrary.replaceAttributeSelector('#tildequark'), false);
+  t.is(rcs.selectorLibrary.replaceAttributeSelector('#quarktilde'), false);
+  t.is(rcs.selectorLibrary.replaceAttributeSelector('#quarktildeafter'), false);
+  t.is(rcs.selectorLibrary.replaceAttributeSelector('#nix'), false);
+});
+
 test('replaceAttributeSelector | combination', (t) => {
   rcs.selectorLibrary.setAttributeSelector([
     '[class=equal]',