Merge pull request #781 from qawolf/is-dynamic

Make isDynamic more stringent on trailing characters

package.json

@@ -62,7 +62,7 @@
   },
   "devDependencies": {
     "@ffmpeg-installer/ffmpeg": "^1.0.20",
-    "@qawolf/sandbox": "0.1.15",
+    "@qawolf/sandbox": "0.1.16",
     "@types/debug": "^4.1.5",
     "@types/fs-extra": "^9.0.1",
     "@types/glob": "^7.1.3",

packages/sandbox/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qawolf/sandbox",
-  "version": "0.1.15",
+  "version": "0.1.16",
   "files": [
     "bin",
     "build"

packages/sandbox/src/pages/Buttons/HtmlButtons.js

@@ -23,10 +23,10 @@ function HtmlButtons() {
       <button id="whitespace-button">{'     I have extra whitespace  '}</button>
       <br />
       <br />
-      <button className="btn-a btn-1">Classes</button>
-      <button className="btn-a btn-2">Classes</button>
-      <button className="btn-b btn-1">Classes</button>
-      <button className="btn-b btn-2">Classes</button>
+      <button className="first-half type-one">Classes</button>
+      <button className="first-half type-two">Classes</button>
+      <button className="second-half type-one">Classes</button>
+      <button className="second-half type-two">Classes</button>
       <br />
       <br />
       <button id="nested">

src/web/isDynamic.ts

@@ -37,12 +37,8 @@ const SCORE_THRESHOLD = 0.5;
 export const getTokens = (value: string): string[] => {
   const tokens = [];
 
-  // remove a numeric or alphabetic suffix
-  // ex: btn-1, btn_z -> btn
-  const symbol = value.replace(/[-_]+(\d+|\w)$/, '');
-
   // split by space, dash, and camel case
-  symbol.split(/[ \-_]+|(?=[A-Z])/).forEach((token) => {
+  value.split(/[ \-_]+|(?=[A-Z])/).forEach((token) => {
     if (!token) return; // ignore empty string
 
     tokens.push(token.toLowerCase());

test/web/isDynamic.test.ts

@@ -9,6 +9,7 @@ describe('isDynamic', () => {
     'gLFyf',
     'intercom-123v9c3',
     'StyledBox-sc-13pk1d4-0',
+    'StyledLayer-rmtehz-0',
     'TSPr2b',
     'u_0_b',
   ])('is dynamic: %s', (example) => {
@@ -19,7 +20,6 @@ describe('isDynamic', () => {
     'app',
     'b-content__page-input',
     'btn',
-    'btn-b',
     'btn-playr-primary',
     'central-textlogo__image',
     'col-sm-12',

test/web/selector.test.ts

@@ -100,7 +100,7 @@ describe('buildSelector', () => {
         // selects the ancestor
         [['#html-button-child', '[data-qa="html-button-with-children"]']],
         [['.MuiButton-label', '[data-qa="material-button"]']],
-        ['.btn-b.btn-2'],
+        ['.second-half.type-two'],
       ])('builds expected selector %o', (selector) => expectSelector(selector));
     });
 
@@ -224,7 +224,7 @@ describe('buildSelector', () => {
         [['#button', '[data-test="click"] [data-qa="button"]']],
         // unique selectors
         [['#unique', '[data-qa="unique"]']],
-        [['#dog-0', '[data-qa="radio-group"] #dog-0']],
+        [['#dog-0', '[data-qa="radio-group"] [value="dog-0"]']],
       ])('builds expected selector %o', (selector) => expectSelector(selector));
     });