feat: within support

Author: Ben Monro

src/index.js

@@ -29,7 +29,7 @@ function injectNWTL(browser) {
 }
 
 
-module.exports.getQueriesFrom = (browser) => {
+const getQueriesFrom = (browser, container) => {
     const queries = {};
     Object.keys(baseQueries).forEach(queryName => {
         queries[queryName] = (...args) => new Promise((resolve, reject) => {
@@ -42,7 +42,7 @@ module.exports.getQueriesFrom = (browser) => {
 
             injectNWTL(browser)
             // eslint-disable-next-line no-shadow
-            browser.execute(function (queryName, ...args) {
+            browser.execute(function (queryName, container, ...args) {
                 try {
                     args = args.map(arg => {
                         if (arg.RegExp) {
@@ -51,14 +51,15 @@ module.exports.getQueriesFrom = (browser) => {
                         }
                         return arg;
                     });
+                    const root = container ? document.querySelector(container) : document.body;
                     if (/AllBy/.test(queryName)) {
-                        const elms = window.TestingLibraryDom[queryName](document.body, ...args);
+                        const elms = window.TestingLibraryDom[queryName](root, ...args);
 
                         const selector = elms.map(elm => window.Simmer(elm)).join(', ');
 
                         return selector;
                     } else {
-                        const elm = window.TestingLibraryDom[queryName](document.body, ...args);
+                        const elm = window.TestingLibraryDom[queryName](root, ...args);
 
                         const selector = window.Simmer(elm);
 
@@ -67,7 +68,7 @@ module.exports.getQueriesFrom = (browser) => {
                 } catch (e) {
                     return { error: { message: e.message, stack: e.stack } };
                 }
-            }, [queryName, ...args], (result) => {
+            }, [queryName, container, ...args], (result) => {
 
 
                 if (result.value.error) {
@@ -83,7 +84,8 @@ module.exports.getQueriesFrom = (browser) => {
                 }
                 resolve({
                     selector,
-                    nth(index) { return (({ selector, index })) }
+                    nth(index) { return (({ selector: selector.split(/, /)[index], browser: () => browser })) },
+                    browser: () => browser
                 })
 
 
@@ -93,7 +95,12 @@ module.exports.getQueriesFrom = (browser) => {
 
     return queries;
 }
-
-module.exports.configure = (config) => {
+const within = (selector) => {
+    return getQueriesFrom(selector.browser(), selector.selector);
+}
+const configure = (config) => {
     _config = config;
+}
+module.exports = {
+    configure, getQueriesFrom, within
 }

tests/globals/index.js

@@ -0,0 +1,4 @@
+module.exports = {
+
+
+}

tests/nightwatch/configure.test.js

@@ -0,0 +1,38 @@
+const { configure, getQueriesFrom } = require('../../src');
+
+configure({ testIdAttribute: 'data-automation-id' });
+
+module.exports = {
+    before() {
+
+        configure({ testIdAttribute: 'data-automation-id' });
+
+    },
+    after() {
+        configure(null);
+    },
+    beforeEach(browser, done) {
+        browser
+            .url('http://localhost:13370');
+        done()
+    },
+    async 'supports alternative testIdAttribute'(browser) {
+        const { getByTestId } = getQueriesFrom(browser);
+
+        const image = await getByTestId('image-with-random-alt-tag');
+        browser.click(image);
+        browser.expect.element(image).to.have.css('border').which.equals('5px solid rgb(255, 0, 0)')
+
+    },
+
+    async 'still works after navigation'(browser) {
+        const { getByTestId, getByText } = getQueriesFrom(browser);
+
+        browser.click(await getByText('Go to Page 2'));
+
+        browser.click(await getByTestId('page2-thing'));
+
+        browser.expect.element(await getByText('second page')).to.be.present;
+
+    }
+}

tests/nightwatch/index.test.js

@@ -2,6 +2,11 @@ const { getQueriesFrom } = require('../../src');
 
 module.exports = {
 
+    beforeEach(browser, done) {
+        browser
+            .url('http://localhost:13370');
+        done()
+    },
 
     async 'Button click works'(browser) {
         const { getByText } = getQueriesFrom(browser);

tests/nightwatch/within.test.js

@@ -0,0 +1,42 @@
+const { getQueriesFrom, within } = require('../../src');
+
+
+module.exports = {
+    beforeEach(browser, done) {
+        browser
+            .url('http://localhost:13370');
+        done()
+    },
+    async 'getByText within container'(browser) {
+        const { getByTestId } = getQueriesFrom(browser);
+
+        const nested = await getByTestId('nested');
+        const button = await within(nested).getByText('Button Text');
+
+        browser.click(button);
+        browser.expect.element(button).text.to.equal('Button Clicked');
+
+    },
+
+
+    async 'works with nested selector from "All" query with index - regex'(browser) {
+
+        const { getAllByTestId } = getQueriesFrom(browser);
+
+        const nestedDivs = await getAllByTestId(/nested/);
+
+        browser.expect.elements(nestedDivs).count.to.equal(2)
+
+        const nested = within(nestedDivs.nth(1));
+
+        const button = await nested.getByText('Button Text');
+        const text = await nested.getByText('text only in 2nd nested');
+
+        browser.expect.element(button).to.be.present;
+        browser.expect.element(text).to.be.present;
+        // await t
+        //     .expect(nested.getByText('Button Text').exists).ok()
+        //     .expect(nested.getByText('text only in 2nd nested').exists).ok()
+
+    },
+}