From 8988ccda5c36c02ee68d90b888beb4a54f901666 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C3=ABl=20De=20Boey?= Date: Fri, 13 May 2022 18:15:48 +0200 Subject: [PATCH] test: refactor `@testing-library/angular` tests --- lib/rules/no-dom-import.ts | 72 +++-- tests/lib/rules/await-async-query.test.ts | 1 + tests/lib/rules/await-async-utils.test.ts | 1 + tests/lib/rules/no-await-sync-query.test.ts | 1 + tests/lib/rules/no-container.test.ts | 1 + tests/lib/rules/no-debugging-utils.test.ts | 1 + tests/lib/rules/no-dom-import.test.ts | 275 ++++++++---------- tests/lib/rules/no-node-access.test.ts | 1 + .../rules/no-promise-in-fire-event.test.ts | 1 + tests/lib/rules/no-render-in-setup.test.ts | 1 + .../rules/no-wait-for-empty-callback.test.ts | 1 + .../no-wait-for-multiple-assertions.test.ts | 1 + .../rules/no-wait-for-side-effects.test.ts | 1 + tests/lib/rules/no-wait-for-snapshot.test.ts | 1 + tests/lib/rules/prefer-find-by.test.ts | 1 + .../prefer-query-by-disappearance.test.ts | 1 + tests/lib/rules/prefer-screen-queries.test.ts | 1 + .../render-result-naming-convention.test.ts | 1 + 18 files changed, 167 insertions(+), 196 deletions(-) diff --git a/lib/rules/no-dom-import.ts b/lib/rules/no-dom-import.ts index 299a73f3..1b180ec0 100644 --- a/lib/rules/no-dom-import.ts +++ b/lib/rules/no-dom-import.ts @@ -12,6 +12,14 @@ const DOM_TESTING_LIBRARY_MODULES = [ '@testing-library/dom', ]; +const correctModuleNameByFramework = { + angular: '@testing-library/angular', // ATL is *always* called `@testing-library/angular` + marko: '@marko/testing-library', // Marko TL is called `@marko/testing-library` +}; +const getCorrectModuleName = (moduleName: string, framework: string): string => + correctModuleNameByFramework[framework] || + moduleName.replace('dom', framework); + export default createTestingLibraryRule({ name: RULE_NAME, meta: { @@ -33,11 +41,7 @@ export default createTestingLibraryRule({ 'import from DOM Testing Library is restricted, import from {{module}} instead', }, fixable: 'code', - schema: [ - { - type: 'string', - }, - ], + schema: [{ type: 'string' }], }, defaultOptions: [''], @@ -46,42 +50,36 @@ export default createTestingLibraryRule({ node: TSESTree.CallExpression | TSESTree.ImportDeclaration, moduleName: string ) { - if (framework) { - // marko TL is called @marko/testing-library - const correctModuleName = - framework === 'marko' - ? moduleName.replace('dom-', `@${framework}/`) - : moduleName.replace('dom', framework); - context.report({ - node, - messageId: 'noDomImportFramework', - data: { - module: correctModuleName, - }, - fix(fixer) { - if (isCallExpression(node)) { - const name = node.arguments[0] as TSESTree.Literal; - - // Replace the module name with the raw module name as we can't predict which punctuation the user is going to use - return fixer.replaceText( - name, - name.raw.replace(moduleName, correctModuleName) - ); - } else { - const name = node.source; - return fixer.replaceText( - name, - name.raw.replace(moduleName, correctModuleName) - ); - } - }, - }); - } else { - context.report({ + if (!framework) { + return context.report({ node, messageId: 'noDomImport', }); } + + const correctModuleName = getCorrectModuleName(moduleName, framework); + context.report({ + data: { module: correctModuleName }, + fix(fixer) { + if (isCallExpression(node)) { + const name = node.arguments[0] as TSESTree.Literal; + + // Replace the module name with the raw module name as we can't predict which punctuation the user is going to use + return fixer.replaceText( + name, + name.raw.replace(moduleName, correctModuleName) + ); + } else { + const name = node.source; + return fixer.replaceText( + name, + name.raw.replace(moduleName, correctModuleName) + ); + } + }, + messageId: 'noDomImportFramework', + node, + }); } return { diff --git a/tests/lib/rules/await-async-query.test.ts b/tests/lib/rules/await-async-query.test.ts index e913dd20..f4b8b93f 100644 --- a/tests/lib/rules/await-async-query.test.ts +++ b/tests/lib/rules/await-async-query.test.ts @@ -13,6 +13,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/await-async-utils.test.ts b/tests/lib/rules/await-async-utils.test.ts index b1ddac2b..5d01bcfd 100644 --- a/tests/lib/rules/await-async-utils.test.ts +++ b/tests/lib/rules/await-async-utils.test.ts @@ -6,6 +6,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-await-sync-query.test.ts b/tests/lib/rules/no-await-sync-query.test.ts index 4e8e8304..e9246427 100644 --- a/tests/lib/rules/no-await-sync-query.test.ts +++ b/tests/lib/rules/no-await-sync-query.test.ts @@ -9,6 +9,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-container.test.ts b/tests/lib/rules/no-container.test.ts index b0410072..fd1b4d94 100644 --- a/tests/lib/rules/no-container.test.ts +++ b/tests/lib/rules/no-container.test.ts @@ -4,6 +4,7 @@ import { createRuleTester } from '../test-utils'; const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-debugging-utils.test.ts b/tests/lib/rules/no-debugging-utils.test.ts index 5575211b..58259616 100644 --- a/tests/lib/rules/no-debugging-utils.test.ts +++ b/tests/lib/rules/no-debugging-utils.test.ts @@ -4,6 +4,7 @@ import { createRuleTester } from '../test-utils'; const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-dom-import.test.ts b/tests/lib/rules/no-dom-import.test.ts index 50d0469a..d12174ff 100644 --- a/tests/lib/rules/no-dom-import.test.ts +++ b/tests/lib/rules/no-dom-import.test.ts @@ -4,29 +4,50 @@ import { createRuleTester } from '../test-utils'; const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ - 'react-testing-library', - '@testing-library/react', - '@marko/testing-library', + { + configOption: 'angular', + oldName: '@testing-library/angular', + newName: '@testing-library/angular', + }, + { + configOption: 'react', + oldName: 'react-testing-library', + newName: '@testing-library/react', + }, + { + configOption: 'vue', + oldName: 'vue-testing-library', + newName: '@testing-library/vue', + }, + { + configOption: 'marko', + oldName: '@marko/testing-library', + newName: '@marko/testing-library', + }, ]; ruleTester.run(RULE_NAME, rule, { valid: [ 'import { foo } from "foo"', 'import "foo"', - ...SUPPORTED_TESTING_FRAMEWORKS.flatMap((testingFramework) => [ - `import { fireEvent } from "${testingFramework}"`, - `import * as testing from "${testingFramework}"`, - `import "${testingFramework}"`, - ]), + ...SUPPORTED_TESTING_FRAMEWORKS.flatMap(({ oldName, newName }) => + [oldName, newName].flatMap((testingFramework) => [ + `import { fireEvent } from "${testingFramework}"`, + `import * as testing from "${testingFramework}"`, + `import "${testingFramework}"`, + ]) + ), 'const { foo } = require("foo")', 'require("foo")', 'require("")', 'require()', - ...SUPPORTED_TESTING_FRAMEWORKS.flatMap((testingFramework) => [ - `const { fireEvent } = require("${testingFramework}")`, - `const { fireEvent: testing } = require("${testingFramework}")`, - `require("${testingFramework}")`, - ]), + ...SUPPORTED_TESTING_FRAMEWORKS.flatMap(({ oldName, newName }) => + [oldName, newName].flatMap((testingFramework) => [ + `const { fireEvent } = require("${testingFramework}")`, + `const { fireEvent: testing } = require("${testingFramework}")`, + `require("${testingFramework}")`, + ]) + ), { code: 'import { fireEvent } from "test-utils"', settings: { 'testing-library/utils-module': 'test-utils' }, @@ -59,192 +80,128 @@ ruleTester.run(RULE_NAME, rule, { // case: dom-testing-library imported with custom module setting import { fireEvent } from "dom-testing-library"`, }, - { - code: 'import { fireEvent } from "dom-testing-library"', - options: ['react'], - errors: [ - { - messageId: 'noDomImportFramework', - data: { - module: 'react-testing-library', - }, - }, - ], - output: `import { fireEvent } from "react-testing-library"`, - }, - { - code: 'import { fireEvent } from "dom-testing-library"', - options: ['marko'], - errors: [ - { - messageId: 'noDomImportFramework', - data: { - module: '@marko/testing-library', - }, - }, - ], - output: `import { fireEvent } from "@marko/testing-library"`, - }, - // Single quote or double quotes should not be replaced - { - code: `import { fireEvent } from 'dom-testing-library'`, - options: ['react'], - errors: [ - { - messageId: 'noDomImportFramework', - data: { - module: 'react-testing-library', - }, - }, - ], - output: `import { fireEvent } from 'react-testing-library'`, - }, + ...SUPPORTED_TESTING_FRAMEWORKS.flatMap( + ({ configOption, oldName, newName }) => + [true, false].flatMap((isOldImport) => + // Single quote or double quotes should not be replaced + [`'`, `"`].flatMap((quote) => [ + { + code: `const { fireEvent } = require(${quote}${ + isOldImport ? 'dom-testing-library' : '@testing-library/dom' + }${quote})`, + options: [configOption], + errors: [ + { + data: { module: isOldImport ? oldName : newName }, + messageId: 'noDomImportFramework', + }, + ], + output: `const { fireEvent } = require(${quote}${ + isOldImport ? oldName : newName + }${quote})`, + } as const, + { + code: `import { fireEvent } from ${quote}${ + isOldImport ? 'dom-testing-library' : '@testing-library/dom' + }${quote}`, + options: [configOption], + errors: [ + { + data: { module: isOldImport ? oldName : newName }, + messageId: 'noDomImportFramework', + }, + ], + output: `import { fireEvent } from ${quote}${ + isOldImport ? oldName : newName + }${quote}`, + } as const, + ]) + ) + ), { code: 'import * as testing from "dom-testing-library"', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, { - settings: { - 'testing-library/utils-module': 'test-utils', - }, + settings: { 'testing-library/utils-module': 'test-utils' }, code: ` // case: dom-testing-library wildcard imported with custom module setting import * as testing from "dom-testing-library"`, - errors: [ - { - line: 3, - messageId: 'noDomImport', - }, - ], + errors: [{ line: 3, messageId: 'noDomImport' }], }, { code: 'import { fireEvent } from "@testing-library/dom"', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, { - settings: { - 'testing-library/utils-module': 'test-utils', - }, + settings: { 'testing-library/utils-module': 'test-utils' }, code: ` // case: @testing-library/dom imported with custom module setting import { fireEvent } from "@testing-library/dom"`, - errors: [ - { - line: 3, - messageId: 'noDomImport', - }, - ], + errors: [{ line: 3, messageId: 'noDomImport' }], }, { code: 'import * as testing from "@testing-library/dom"', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, { code: 'import "dom-testing-library"', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, { code: 'import "@testing-library/dom"', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, { code: 'const { fireEvent } = require("dom-testing-library")', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, { - settings: { - 'testing-library/utils-module': 'test-utils', - }, + settings: { 'testing-library/utils-module': 'test-utils' }, code: ` // case: dom-testing-library required with custom module setting const { fireEvent } = require("dom-testing-library")`, - errors: [ - { - line: 3, - messageId: 'noDomImport', - }, - ], + errors: [{ line: 3, messageId: 'noDomImport' }], }, { code: 'const { fireEvent } = require("@testing-library/dom")', - errors: [ - { - messageId: 'noDomImport', - }, - ], - }, - { - code: 'const { fireEvent } = require("@testing-library/dom")', - options: ['vue'], - errors: [ - { - messageId: 'noDomImportFramework', - data: { - module: '@testing-library/vue', - }, - }, - ], - output: 'const { fireEvent } = require("@testing-library/vue")', - }, - { - settings: { - 'testing-library/utils-module': 'test-utils', - }, - code: ` - // case: @testing-library/dom required with custom module setting - const { fireEvent } = require("@testing-library/dom")`, - options: ['vue'], - errors: [ - { - messageId: 'noDomImportFramework', - data: { - module: '@testing-library/vue', - }, - }, - ], - output: ` - // case: @testing-library/dom required with custom module setting - const { fireEvent } = require("@testing-library/vue")`, - }, + errors: [{ messageId: 'noDomImport' }], + }, + ...SUPPORTED_TESTING_FRAMEWORKS.flatMap( + ({ configOption, oldName, newName }) => + [true, false].map( + (isOldImport) => + ({ + settings: { 'testing-library/utils-module': 'test-utils' }, + code: ` + // case: @testing-library/dom required with custom module setting + const { fireEvent } = require("${ + isOldImport ? 'dom-testing-library' : '@testing-library/dom' + }") + `, + options: [configOption], + errors: [ + { + data: { module: isOldImport ? oldName : newName }, + messageId: 'noDomImportFramework', + }, + ], + output: ` + // case: @testing-library/dom required with custom module setting + const { fireEvent } = require("${ + isOldImport ? oldName : newName + }") + `, + } as const) + ) + ), { code: 'require("dom-testing-library")', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, { code: 'require("@testing-library/dom")', - errors: [ - { - messageId: 'noDomImport', - }, - ], + errors: [{ messageId: 'noDomImport' }], }, ], }); diff --git a/tests/lib/rules/no-node-access.test.ts b/tests/lib/rules/no-node-access.test.ts index e4b92bba..8b44d729 100644 --- a/tests/lib/rules/no-node-access.test.ts +++ b/tests/lib/rules/no-node-access.test.ts @@ -4,6 +4,7 @@ import { createRuleTester } from '../test-utils'; const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-promise-in-fire-event.test.ts b/tests/lib/rules/no-promise-in-fire-event.test.ts index d43f4ee3..0390978f 100644 --- a/tests/lib/rules/no-promise-in-fire-event.test.ts +++ b/tests/lib/rules/no-promise-in-fire-event.test.ts @@ -6,6 +6,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/foo', '@testing-library/dom', + '@testing-library/angular', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-render-in-setup.test.ts b/tests/lib/rules/no-render-in-setup.test.ts index bf0380fa..7e5640e0 100644 --- a/tests/lib/rules/no-render-in-setup.test.ts +++ b/tests/lib/rules/no-render-in-setup.test.ts @@ -6,6 +6,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/foo', + '@testing-library/angular', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-wait-for-empty-callback.test.ts b/tests/lib/rules/no-wait-for-empty-callback.test.ts index b1b84e3f..22705fa0 100644 --- a/tests/lib/rules/no-wait-for-empty-callback.test.ts +++ b/tests/lib/rules/no-wait-for-empty-callback.test.ts @@ -6,6 +6,7 @@ const ruleTester = createRuleTester(); const ALL_WAIT_METHODS = ['waitFor', 'waitForElementToBeRemoved']; const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-wait-for-multiple-assertions.test.ts b/tests/lib/rules/no-wait-for-multiple-assertions.test.ts index ce2770c5..7b8e4cef 100644 --- a/tests/lib/rules/no-wait-for-multiple-assertions.test.ts +++ b/tests/lib/rules/no-wait-for-multiple-assertions.test.ts @@ -7,6 +7,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-wait-for-side-effects.test.ts b/tests/lib/rules/no-wait-for-side-effects.test.ts index 24bb0a9f..40f240af 100644 --- a/tests/lib/rules/no-wait-for-side-effects.test.ts +++ b/tests/lib/rules/no-wait-for-side-effects.test.ts @@ -5,6 +5,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/no-wait-for-snapshot.test.ts b/tests/lib/rules/no-wait-for-snapshot.test.ts index 47e3f13a..d43f0e86 100644 --- a/tests/lib/rules/no-wait-for-snapshot.test.ts +++ b/tests/lib/rules/no-wait-for-snapshot.test.ts @@ -6,6 +6,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@marko/testing-library', ]; diff --git a/tests/lib/rules/prefer-find-by.test.ts b/tests/lib/rules/prefer-find-by.test.ts index 622640c3..10514e97 100644 --- a/tests/lib/rules/prefer-find-by.test.ts +++ b/tests/lib/rules/prefer-find-by.test.ts @@ -17,6 +17,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/foo', '@testing-library/dom', + '@testing-library/angular', '@marko/testing-library', ]; diff --git a/tests/lib/rules/prefer-query-by-disappearance.test.ts b/tests/lib/rules/prefer-query-by-disappearance.test.ts index 0e465446..f488a8cd 100644 --- a/tests/lib/rules/prefer-query-by-disappearance.test.ts +++ b/tests/lib/rules/prefer-query-by-disappearance.test.ts @@ -7,6 +7,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/prefer-screen-queries.test.ts b/tests/lib/rules/prefer-screen-queries.test.ts index f44f3cb4..a1c15f55 100644 --- a/tests/lib/rules/prefer-screen-queries.test.ts +++ b/tests/lib/rules/prefer-screen-queries.test.ts @@ -10,6 +10,7 @@ const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ '@testing-library/dom', + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ]; diff --git a/tests/lib/rules/render-result-naming-convention.test.ts b/tests/lib/rules/render-result-naming-convention.test.ts index aaeb551f..541551b3 100644 --- a/tests/lib/rules/render-result-naming-convention.test.ts +++ b/tests/lib/rules/render-result-naming-convention.test.ts @@ -6,6 +6,7 @@ import { createRuleTester } from '../test-utils'; const ruleTester = createRuleTester(); const SUPPORTED_TESTING_FRAMEWORKS = [ + '@testing-library/angular', '@testing-library/react', '@marko/testing-library', ];