site-kit-wp icon indicating copy to clipboard operation
site-kit-wp copied to clipboard

Fix error in `DashboardNavigation` stories

Open aaemnnosttv opened this issue 2 years ago • 4 comments

Bug Description

VRT runs currently show the following ReferenceError that happens several times during a test run:

Unexpected error while loading ./components/DashboardNavigation/index.stories.js: ReferenceError: describe is not defined

This is from the stories module importing a helper from a Jest test file which includes calls to describe as a side-effect. This is provided automatically by Jest so it errors as undefined in VRT runs.

Steps to reproduce

  1. Run VRT or inspect the output of a run
  2. See the error above

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

  • The describe is not defined error should not be raised during VRT runs

Implementation Brief

  • We need to import the setupDefaultChips() function into the story file from a non-Jest file so that describe isn't called as a side-effect.
  • Inside assets/js/components/DashboardNavigation:
    • Create a new file named test-utils.js. In this file:
      • Add the default file header comments. The description of the file should be DashboardNavigation test utility functions..
      • Copy over the setupDefaultChips() function from index.test.js to this file (including relevant imports and JSDoc comments).
    • In index.test.js, import setupDefaultChips() from test-utils.js. Remove unnecessary dependencies
    • In index.stories.js, import setupDefaultChips() from test-utils.js instead of index.test.js.

Test Coverage

  • N/A

QA Brief

  • QA:Eng - The Reference Error mentioned in the AC will not show up in VRT test logs.
    • Check it in the PR run.
    • Check locally as well.

Changelog entry

  • Fix js errors in the storybook stories.

aaemnnosttv avatar Jul 21 '22 04:07 aaemnnosttv

Hey @nfmohit, this IB looks good. One minor tweak I would suggest is to use the filename test-utils.js rather than utils.js, just to make it clear that what's in the file is related to non-production code only.

techanvil avatar Jul 29 '22 12:07 techanvil

Hey @nfmohit, this IB looks good. One minor tweak I would suggest is to use the filename test-utils.js rather than utils.js, just to make it clear that what's in the file is related to non-production code only.

Very valid suggestion. I've updated the IB. Thank you @techanvil!

nfmohit avatar Aug 01 '22 09:08 nfmohit

Thanks @nfmohit!

IB :white_check_mark:

techanvil avatar Aug 02 '22 10:08 techanvil

QA:Eng Verified ✅

  • Verified it in the PR run.
  • Verified running VRT locally as well.

hussain-t avatar Aug 16 '22 11:08 hussain-t