test(table-of-contents): add e2e-storybook test coverage #7673

andy-blum · 2021-11-16T17:06:29Z

Related Ticket(s)

Closes: #7444 #7445 #7446

Description

Adds new e2e-storybook test for table-of-contents web components component
Adds new e2e-storybook test for table-of-contents react component
Adds new cypress-local.json config & yarn commands to make test writing & debugging easier

Changelog

New

Adds new command yarn test:e2e-storybook:dev that opens the Cypress client on a currently-running storybook instance to ease test writing & debugging
Adds e2e-storybook test coverage for table of contents component

…lopment

ibmdotcom-bot · 2021-11-16T17:48:59Z

Deploy preview created for package Web Components (React wrapper):
https://ibmdotcom-web-components-react.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7673/index.html

Built with commit: dcfa294573ffe718b6d2d7ddfed8f38c9f64feaf

ibmdotcom-bot · 2021-11-16T17:52:23Z

Deploy preview created for package Web Components HTML Test Application:
https://ibmdotcom-web-components-html-test-upstream.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7673/index.html

Built with commit: dcfa294573ffe718b6d2d7ddfed8f38c9f64feaf

ibmdotcom-bot · 2021-11-16T17:54:57Z

Deploy preview created for package React:
https://ibmdotcom-react.s3.us-south.cloud-object-storage.appdomain.cloud/deploy-previews/7673/index.html

Built with commit: dcfa294573ffe718b6d2d7ddfed8f38c9f64feaf

ibmdotcom-bot · 2021-11-16T17:55:54Z

Deploy preview created for package Web Components:
https://ibmdotcom-webcomponents.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7673/index.html

Built with commit: dcfa294573ffe718b6d2d7ddfed8f38c9f64feaf

ibmdotcom-bot · 2021-11-16T19:57:38Z

Deploy preview created for package "Web Components (Codesandbox Examples)":
https://webcomponents-codesandbox.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7673/index.html

Built with commit: dcfa294573ffe718b6d2d7ddfed8f38c9f64feaf

ibmdotcom-bot · 2021-11-16T20:26:10Z

Deploy preview created for package "React (Codesandbox Examples)":
https://react-codesandbox.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7673/index.html

Built with commit: dcfa294573ffe718b6d2d7ddfed8f38c9f64feaf

ibmdotcom-bot · 2021-11-17T01:50:48Z

Deploy preview created for package NextJS Test Application:
https://ibmdotcom-nextjs-test-upstream.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7673/index.html

Built with commit: dcfa294573ffe718b6d2d7ddfed8f38c9f64feaf

packages/web-components/package.json

...omponents/tests/e2e-storybook/cypress/integration/table-of-contents/table-of-contents.e2e.js

andy-blum · 2021-11-17T20:39:36Z

@jeffchew #7444 has the react package tag on it, but there's already a TOC test in the react packages e2e-storybook directory.

Does it need touched?

ariellalgilmore · 2021-11-18T16:57:03Z

@jeffchew #7444 has the react package tag on it, but there's already a TOC test in the react packages e2e-storybook directory.

Does it need touched?

@andy-blum yeah we should be updating tests for react as well.

ariellalgilmore

LGTM! Thank you @andy-blum

…m/carbon-for-ibm-dotcom into tests/table-of-contents

ariellalgilmore · 2021-11-19T22:04:01Z

packages/react/tests/e2e-storybook/cypress/support/commands.js

+/**
+ * Cycle through carbon themes and take a screenshot
+ */
+Cypress.Commands.add('carbonScreenshot', (screenshotOpts = {}) => {


Awesomeee!!! just small name change

Suggested change

Cypress.Commands.add('carbonScreenshot', (screenshotOpts = {}) => {

Cypress.Commands.add('carbonThemesScreenshot', (screenshotOpts = {}) => {

@jeffchew I just removed the ready to merge label for this

jeffchew

LGTM!

jeffchew · 2021-11-22T16:34:59Z

Going to re-run the e2e tests for web components, looks like the table of contents tests failed.

jeffchew · 2021-11-22T21:52:26Z

@andy-blum the tests appear to almost be done but seeing some weird error:

andy-blum · 2021-11-22T21:55:05Z

Curious if that's from the Percy snapshot command. Do you know where that's defined?

jeffchew · 2021-11-23T16:34:55Z

packages/react/tests/e2e-storybook/cypress/integration/TableOfContents/TableOfContents.e2e.js

+    'should remain visible on page throughout scroll',
+    _tests.mobile.checkStickyNav
+  );
+  it('should render correctly in all themes', _tests.all.screenshotThemes);


@andy-blum I think this is the issue, didn't you rename the method to carbonThemesScreenshot?

talked to @andy-blum on slack and the method is calling carbonThemesScreenshot above, but i think it might be the width causing the error https://github.com/carbon-design-system/carbon-for-ibm-dotcom/pull/7673/files#diff-a42d6ed5ec53b43667f81c546bfc457893f5157db7a2bddd00eef414126fc929R35

fix pushed up. 🤞

Looks like the react e2e-storybook tests are failing now 😞

re-ran and it passed!!! Looks like this one is good to go :D

andy-blum added 3 commits November 16, 2021 09:26

test(table-of-contents): add yarn command for local cypress test deve…

896fee0

…lopment

Merge branch 'main' into tests/table-of-contents

ad8803d

test(table-of-contents): add e2e-storybook test

af83868

andy-blum requested a review from ariellalgilmore November 16, 2021 17:06

test(table-of-contents): remove uncaught-exception handling

684943d

andy-blum added 2 commits November 16, 2021 22:01

test(table-of-contents): simplify tests, add mobile coverage

793cfbb

Merge branch 'master' into tests/table-of-contents

ef1bc10

andy-blum marked this pull request as ready for review November 17, 2021 03:03

andy-blum requested a review from a team as a code owner November 17, 2021 03:03

andy-blum requested review from photodow and andysherman2121 November 17, 2021 03:03

andy-blum changed the title ~~Tests/table of contents~~ test(table-of-contents): add e2e-storybook test coverage Nov 17, 2021

jeffchew reviewed Nov 17, 2021

View reviewed changes

packages/web-components/package.json Outdated Show resolved Hide resolved

jeffchew reviewed Nov 17, 2021

View reviewed changes

...omponents/tests/e2e-storybook/cypress/integration/table-of-contents/table-of-contents.e2e.js Show resolved Hide resolved

andy-blum added 2 commits November 17, 2021 11:26

test(table-of-contents): update script, add jsDocs

523011b

Merge branch 'master' into tests/table-of-contents

b497561

andy-blum requested a review from jeffchew November 17, 2021 20:03

andy-blum added 4 commits November 19, 2021 09:10

test(table-of-contents): add local e2e command & config

4bc2e90

test(table-of-contents): update react e2e-storybook test

ba30d8c

test(table-of-contents): remove debugging code

996cdca

Merge branch 'master' into tests/table-of-contents

e0e7c60

test(table-of-contents): add screenshots and percySnapshots

12801f2

jeffchew mentioned this pull request Nov 19, 2021

[PR Reviews]: Jeff - Sprint 23 #7617

Closed

andy-blum added 2 commits November 19, 2021 15:06

test(table-of-contents): add percySnaphsots to WC tests

2cdd8a6

Merge branch 'master' into tests/table-of-contents

50b39d4

ariellalgilmore approved these changes Nov 19, 2021

View reviewed changes

ariellalgilmore mentioned this pull request Nov 19, 2021

[PR Reviews]: Ari - Sprint 23 #7711

Closed

andy-blum added 2 commits November 19, 2021 16:30

test(table-of-contents): add carbonScreenshot cypress command

d76b1ba

Merge branch 'tests/table-of-contents' of https://github.com/andy-blu…

a56a8b4

…m/carbon-for-ibm-dotcom into tests/table-of-contents

jeffchew added the Ready to merge Label for the pull requests that are ready to merge label Nov 19, 2021

ariellalgilmore reviewed Nov 19, 2021

View reviewed changes

andy-blum removed the Ready to merge Label for the pull requests that are ready to merge label Nov 19, 2021

test(table-of-contents): rename custom command to carbonThemesScreenshot

543fe92

andy-blum requested a review from ariellalgilmore November 22, 2021 14:32

jeffchew approved these changes Nov 22, 2021

View reviewed changes

Merge branch 'master' into tests/table-of-contents

df90772

jeffchew reviewed Nov 23, 2021

View reviewed changes

test(table-of-contents): fix test error

330ec27

ariellalgilmore added the Ready to merge Label for the pull requests that are ready to merge label Nov 23, 2021

jeffchew and others added 3 commits November 23, 2021 16:50

Merge branch 'master' into tests/table-of-contents

676137c

Merge branch 'master' into tests/table-of-contents

6ccbd0a

Merge branch 'master' into tests/table-of-contents

dcfa294

kodiakhq bot merged commit 4c0da7d into carbon-design-system:master Nov 24, 2021

andy-blum deleted the tests/table-of-contents branch November 24, 2021 13:24

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

test(table-of-contents): add e2e-storybook test coverage #7673

test(table-of-contents): add e2e-storybook test coverage #7673

andy-blum commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 17, 2021 •

edited

Loading

andy-blum commented Nov 17, 2021

ariellalgilmore commented Nov 18, 2021

ariellalgilmore left a comment

ariellalgilmore Nov 19, 2021

andy-blum Nov 19, 2021

jeffchew left a comment

jeffchew commented Nov 22, 2021

jeffchew commented Nov 22, 2021

andy-blum commented Nov 22, 2021

jeffchew Nov 23, 2021

ariellalgilmore Nov 23, 2021

andy-blum Nov 23, 2021

andy-blum Nov 23, 2021

ariellalgilmore Nov 23, 2021

	Cypress.Commands.add('carbonScreenshot', (screenshotOpts = {}) => {
	Cypress.Commands.add('carbonThemesScreenshot', (screenshotOpts = {}) => {

test(table-of-contents): add e2e-storybook test coverage #7673

test(table-of-contents): add e2e-storybook test coverage #7673

Conversation

andy-blum commented Nov 16, 2021 • edited Loading

Related Ticket(s)

Description

Changelog

ibmdotcom-bot commented Nov 16, 2021 • edited Loading

ibmdotcom-bot commented Nov 16, 2021 • edited Loading

ibmdotcom-bot commented Nov 16, 2021 • edited Loading

ibmdotcom-bot commented Nov 16, 2021 • edited Loading

ibmdotcom-bot commented Nov 16, 2021 • edited Loading

ibmdotcom-bot commented Nov 16, 2021 • edited Loading

ibmdotcom-bot commented Nov 17, 2021 • edited Loading

andy-blum commented Nov 17, 2021

ariellalgilmore commented Nov 18, 2021

ariellalgilmore left a comment

Choose a reason for hiding this comment

ariellalgilmore Nov 19, 2021

Choose a reason for hiding this comment

andy-blum Nov 19, 2021

Choose a reason for hiding this comment

jeffchew left a comment

Choose a reason for hiding this comment

jeffchew commented Nov 22, 2021

jeffchew commented Nov 22, 2021

andy-blum commented Nov 22, 2021

jeffchew Nov 23, 2021

Choose a reason for hiding this comment

ariellalgilmore Nov 23, 2021

Choose a reason for hiding this comment

andy-blum Nov 23, 2021

Choose a reason for hiding this comment

andy-blum Nov 23, 2021

Choose a reason for hiding this comment

ariellalgilmore Nov 23, 2021

Choose a reason for hiding this comment

andy-blum commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 16, 2021 •

edited

Loading

ibmdotcom-bot commented Nov 17, 2021 •

edited

Loading