Skip to content
This repository has been archived by the owner on Aug 26, 2022. It is now read-only.

Front-end testing cleanup and improvements #7059

Merged
merged 7 commits into from May 12, 2020

Conversation

mindy
Copy link
Contributor

@mindy mindy commented May 12, 2020

Changes:

  • Add eslint-plugin-testing-library (thanks @peterbe for sharing this article!)
  • Import jest-dom before test files - I think we use it enough that it makes sense to always have it available.
  • Clean up existing tests that imported jest-dom matchers individually
  • Fix eslint errors

To test:
Run jest

@mindy mindy requested a review from peterbe May 12, 2020 17:21
@@ -121,7 +121,7 @@ module.exports = {
// setupFiles: [],

// The path to a module that runs some code to configure or set up the testing framework before each test
// setupTestFrameworkScriptFile: null,
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

From the Jest docs:

Note: setupTestFrameworkScriptFile is deprecated in favor of setupFilesAfterEnv.

@@ -55,7 +55,9 @@ export default function Article({ document }: DocumentProps) {
// This is a one-time effect we need to call the first time an article
// is rendered, to ensure that interactive examples resize themselves
// if the browser width changes.
useEffect(InteractiveExamples.makeResponsive, []);
useEffect(() => {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is to fix an eslint error from react-hooks, it said to make this an inline function.

Copy link
Contributor

@peterbe peterbe left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If this works it works for me.

@peterbe peterbe added the merge when green See: https://github.com/phstc/probot-merge-when-green/ label May 12, 2020
}
}, [props.initialQuery]);
}, [initialQuery]);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Another eslint error fix-- props will change when any props change (in this case there's only one prop right now so it doesn't really matter) so the fix is to destructure props and refer to the specific props inside useEffect.

@peterbe peterbe merged commit a212b69 into mdn:master May 12, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
merge when green See: https://github.com/phstc/probot-merge-when-green/
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants