diff --git a/lib/index.ts b/lib/index.ts index 09c90bd..acc5662 100644 --- a/lib/index.ts +++ b/lib/index.ts @@ -3,7 +3,7 @@ import * as path from 'path' import {ElementHandle, EvaluateFn, JSHandle, Page} from 'puppeteer' import waitForExpect from 'wait-for-expect' -import {IQueryUtils, IScopedQueryUtils} from './typedefs' +import {IConfigureOptions, IQueryUtils, IScopedQueryUtils} from './typedefs' const domLibraryAsString = readFileSync( path.join(__dirname, '../dom-testing-library.js'), @@ -17,7 +17,7 @@ function mapArgument(argument: any, index: number): any { : argument } -const delegateFnBodyToExecuteInPage = ` +const delegateFnBodyToExecuteInPageInitial = ` ${domLibraryAsString}; const mappedArgs = args.map(${mapArgument.toString()}); @@ -27,6 +27,8 @@ const delegateFnBodyToExecuteInPage = ` return moduleWithFns[fnName](container, ...mappedArgs); ` +let delegateFnBodyToExecuteInPage = delegateFnBodyToExecuteInPageInitial + type DOMReturnType = ElementHandle | ElementHandle[] | null type ContextFn = (...args: any[]) => ElementHandle @@ -130,6 +132,21 @@ export function wait( return waitForExpect(callback, timeout, interval) } +export function configure(options: Partial): void { + if (!options) { + return + } + + const { testIdAttribute } = options + + if (testIdAttribute) { + delegateFnBodyToExecuteInPage = delegateFnBodyToExecuteInPageInitial.replace( + /testIdAttribute: (['|"])data-testid(['|"])/g, + `testIdAttribute: $1${testIdAttribute}$2`, + ) + } +} + export function getQueriesForElement( object: T, contextFn?: ContextFn, diff --git a/lib/typedefs.ts b/lib/typedefs.ts index 57c87e2..c163154 100644 --- a/lib/typedefs.ts +++ b/lib/typedefs.ts @@ -58,3 +58,7 @@ export interface IQueryUtils extends IQueryMethods { getQueriesForElement(): IQueryUtils & IScopedQueryUtils getNodeText(el: Element): Promise } + +export interface IConfigureOptions { + testIdAttribute: string +} diff --git a/test/fixtures/page.html b/test/fixtures/page.html index 227d8a8..484a179 100644 --- a/test/fixtures/page.html +++ b/test/fixtures/page.html @@ -2,11 +2,11 @@ -

Hello h1

-

Hello h2

+

Hello h1

+

Hello h2

Image A - +
diff --git a/test/index.test.ts b/test/index.test.ts index 7e7fc43..3a1f6dc 100644 --- a/test/index.test.ts +++ b/test/index.test.ts @@ -1,6 +1,6 @@ import * as path from 'path' import * as puppeteer from 'puppeteer' -import {getDocument, queries, getQueriesForElement, wait} from '../lib' +import {getDocument, queries, getQueriesForElement, wait, configure} from '../lib' describe('lib/index.ts', () => { let browser: puppeteer.Browser @@ -18,6 +18,30 @@ describe('lib/index.ts', () => { expect(await queries.getNodeText(element)).toEqual('Hello h1') }) + it('should support custom data-testid attribute name', async () => { + configure({testIdAttribute: 'data-id'}) + const document = await getDocument(page) + const element = await queries.getByTestId(document, 'second-level-header') + expect(await queries.getNodeText(element)).toEqual('Hello h2') + }) + + it('should support subsequent changing the data-testid attribute names', async () => { + configure({testIdAttribute: 'data-id'}) + configure({testIdAttribute: 'data-new-id'}) + const document = await getDocument(page) + const element = await queries.getByTestId(document, 'first-level-header') + expect(await queries.getNodeText(element)).toEqual('Hello h1') + }) + + it('should keep the default data-testid when input passed is invalid', async () => { + ;[{}, undefined, null, {testIdAttribute: ''}].forEach(async options => { + const document = await getDocument(page) + configure(options as any) + const element = await queries.getByTestId(document, 'testid-label') + expect(await queries.getNodeText(element)).toEqual('Label A') + }) + }) + it('should support regex on raw queries object', async () => { const scope = await page.$('#scoped') if (!scope) throw new Error('Should have scope') @@ -41,6 +65,10 @@ describe('lib/index.ts', () => { expect(await getByText('Loaded!')).toBeTruthy() }, 9000) + afterEach(() => { + configure({testIdAttribute: 'data-testid'}) //cleanup + }) + afterAll(async () => { await browser.close() })