Update jetpack extension tests to work with update to @wordpress dependencies #20326

glendaviesnz · 2021-07-11T22:26:30Z

Changes proposed in this Pull Request:

Changes to some Jetpack block test expectations to work with the newer Gutenberg @WordPress dependencies

Related to #19328

Does this pull request change what data or activity we track or use?

No

Testing instructions:

Check our PR and run pnpm install
Run pnpm test-extensions in the projects/plugins/jetpack dir and make sure all pass

github-actions · 2021-07-11T22:28:20Z

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

✅ Include a description of your PR changes.
✅ All commits were linted before commit.
✅ Add a "[Status]" label (In Progress, Needs Team Review, ...).
✅ Add testing instructions.
✅ Specify whether this PR includes any changes to data or privacy.
🔴 Add changelog entries to affected projects

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

The e2e test report can be found here. Please note that it can take a few minutes after the e2e tests checks are complete for the report to be available.

🔴 Action required: Please add missing changelog entries for the following projects: projects/js-packages/components, projects/js-packages/connection, projects/packages/connection-ui, projects/plugins/backup

Use the Jetpack CLI tool to generate changelog entries by running the following command: jetpack changelog add.
Guidelines: /docs/writing-a-good-changelog-entry.md

Once your PR is ready for review, check one last time that all required checks (other than "Required review") appearing at the bottom of this PR are passing or skipped.
Then, add the "[Status] Needs Team review" label and ask someone from your team review the code.
Once you’ve done so, switch to the "[Status] Needs Review" label; someone from Jetpack Crew will then review this PR and merge it to be included in the next Jetpack release.

Backup plugin:

Next scheduled release: August 3, 2021.
Scheduled code freeze: July 26, 2021.

Jetpack plugin:

Next scheduled release: August 3, 2021.
Scheduled code freeze: July 26, 2021.

ramonjd

The tests pass for me.

I couldn't test the block changes to projects/plugins/jetpack/extensions/blocks/recurring-payments/controls.js because I couldn't get this branch to build. (It kept complaining about global.window being undefined in webpack in locale/index.js

So I tested the change onChange={ id => setMembershipAmount( id ) } on the master branch for the Recurring payment plan controls.

It works as expected. I can add/change the payment plan for the selected payment block:

anomiex

I see the several other failures that need fixing:

Looks like the upgrade of @wordpress/eslint-plugin is making it complain about stuff in the e2e directory. linting: Do pnpm install in Jetpack E2E dir before eslint #20333 should fix that.

pnpm build-search is failing with

[3] [webpack-cli] Failed to load '/home/runner/work/jetpack/jetpack/projects/plugins/jetpack/tools/webpack.config.search.js' config
[3] [webpack-cli] Error: Cannot find module '@wordpress/dependency-extraction-webpack-plugin/util'

I'm guessing that @wordpress/dependency-extraction-webpack-plugin/util was renamed or removed?

pnpm build-production-client is failing with

[build-production-client] Message:
[build-production-client]     Module parse failed: Unexpected token (47:304)

pnpm build-extensions is failing with several errors about export 'isRTL' was not found in '@wordpress/i18n' and one about TypeError: document.querySelectorAll is not a function.

anomiex · 2021-07-12T13:45:59Z

projects/packages/backup/changelog/update-internal-dependency

@@ -0,0 +1,5 @@
+Significance: patch


You seem to have added this change entry for packages/backup rather than plugins/backup.

I think you should be able to just move this to projects/plugins/backup/changelog/update-internal-dependency

fixed - also removed some duplicate changelog entries - seems like the renovate bot added some of its own somehow

anomiex · 2021-07-12T13:50:27Z

projects/plugins/jetpack/extensions/blocks/button/test/controls.js

-            const input = within( borderPanel ).getAllByLabelText( 'Border radius' )[ 1 ];
+            const input = borderPanel.querySelector( 'input[type="number"]' );
+            input.focus();
+			fireEvent.change( input, { target: { value: '6' } } );


What's going on with the indentation here?

Also, if you don't mind teaching me a little, what's the difference between using userEvent.type() and fireEvent.change()?

What's going on with the indentation here?

Some this file had a mix of spaces and tabs - not sure why linting didnt pick that up when first committed - should be fixed now, but adds a bit of noise to the PR.

what's the difference between using userEvent.type() and fireEvent.change()

userEvent is the recommended approach as it tries to do a better job of replicating the range of events that happen when a user interacts with an element. fireEvent is a bit lower level and fires only the event specified. In some situations userEvent doesn't seem to work, and gutenberg have changed something about that element that stopped userEvent working, wasn't able to work out what, and I checked gutenberg tests and the core team are using fireEvent to test this component so just copied their approach.

Thanks for the explanation. (:

…encies

This extension is used in place of all `@wordpress/i18n` imports throughout the js codebase. Relatively recently, the `i18n` package stated to export an `isRTL` function, and a lot of consumers use it. Since in Jetpack this package is replaced by this extension - that doesn't export `isRTL` - they were then breaking the build.

…ents

* Add JSDOM to mock document for emotion library * Exclude extensions/shared/i18n-to-php from its own webpack module remapping so some methods from real package can be imported and re-exported * Fix mapping to dependency-extraction-webpack-plugin util file

anomiex · 2021-07-27T15:49:33Z

Sigh, hundreds of "Invalid hook call" errors. Looks like @wordpress/* now depend on react 17, so we have to update everything to that too. Working on it...

Otherwise we get hundreds of "Invalid hook call" errors.

anomiex · 2021-07-27T21:04:53Z

Looks like the build is failing due to the check that the built JS passes ES5. It doesn't due to at least two issues:

@wordpress/browserslist-config 4 dropped IE11 support, so Babel no longer transpiles down to ES5.
Even if we downgrade that to 3.0.3, @wordpress/i18n isn't transpiled and includes a const.

We could just drop the ES5 check, or see what p9dueE-3fG-p2 comes up with.

glendaviesnz · 2021-07-27T22:05:38Z

Thanks @anomiex for sorting out the remaining issues!

We could just drop the ES5 check, or see what p9dueE-3fG-p2 comes up with.

Is it an option to drop the ES5 check for this PR, and add a follow up issue for adding a bundle browser support CI check as a follow up issue? At a quick look around there are some options for checking a bundle for support at the basic es5 versus es6 level but not against a specific browser list, so I am guessing we would need to create something of our own for this, but there may be an existing solution that my searching didn't unearth.

anomiex · 2021-07-28T14:25:18Z

It looks like we could easily enough update it to an ES9 check for now. That's determined through trial and error: there's a spread operator in there somewhere that makes it fail in ES8.

The es-check tool you linked has a feature request at yowainwright/es-check#93 requesting the ability to use browserslist to determine the version. As far as I can tell, the existing eslint invocation we have as a check does the same thing that es-check would do. All we'd need with either tool is a way to turn a browserslist into the appropriate ecmaVersion.

I found eslint-plugin-compat that claims to check things versus the browser list, but it seems that it's about browser globals rather than ES language features. It depends on you passing the correct ecmaVersion to eslint.

Babel does less transpilation now that @wordpress/browserslist-config dropped IE11. ES9 is the minimum version that passes now. Longer term we should replace that check with something better. See p9dueE-3fG-p2 for details.

anomiex

I'm going to go ahead and hit "approve" on this so we can merge it into the parent branch. Tests are passing and it seems at least a few people have poked at it in-browser to verify that things still work.

The failing "Changelogger use" check should pass when merged into the parent due to change entries added there.

anomiex · 2021-07-29T13:12:21Z

Thanks for all the work you did to help make this happen!

glendaviesnz added the [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ label Jul 11, 2021

glendaviesnz requested review from anomiex and a team July 11, 2021 22:26

glendaviesnz self-assigned this Jul 11, 2021

matticbot added the Touches WP.com Files label Jul 11, 2021

github-actions bot added the [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! label Jul 11, 2021

glendaviesnz added [Status] Needs Review To request a review from Crew. Label will be renamed soon. [Status] Needs Team Review labels Jul 11, 2021

github-actions bot added [Package] Backup and removed [Status] Needs Review To request a review from Crew. Label will be renamed soon. labels Jul 11, 2021

glendaviesnz mentioned this pull request Jul 11, 2021

Update jetpack extension tests to work with updated @wordpress dependencies #20315

Closed

ramonjd approved these changes Jul 12, 2021

View reviewed changes

This was referenced Jul 12, 2021

Add a script to allow running of jetpack extension tests against a specific gutenberg versions #20327

Closed

Add ability to run block tests against specific Gutenberg versions #20239

Closed

anomiex mentioned this pull request Jul 12, 2021

linting: Do pnpm install in Jetpack E2E dir before eslint #20333

Merged

anomiex reviewed Jul 12, 2021

View reviewed changes

renovate bot force-pushed the renovate/wordpress-monorepo branch from 2a4a3d4 to f3747db Compare July 12, 2021 16:53

Glen Davies and others added 12 commits July 27, 2021 11:12

Update jetpack extension tests to work with updates @WordPress depend…

3bddc40

…encies

Add changelog files

91e11c8

Fixes from code review

701f3cb

fix indentation

0ed3b10

Replace all the space indentation with tabs

c7767a4

Remove duplicate changelogs

0c911b3

Add babel nullish-coalescing-operator plugin

7a321a1

Add missing style that has been removed from latest @wordpress/compon…

964f143

…ents

Mock CSS global in StaticSiteGeneratorPlugin config

7d73fe8

js-test-runner: With --jsdom, also create global.CSS

0e58e10

anomiex added 2 commits July 27, 2021 13:45

Update react to match what @wordpress/* wants

cd93eb0

Otherwise we get hundreds of "Invalid hook call" errors.

Fix some warnings

ce15092

anomiex force-pushed the fix/extension-tests-for-updated-dependencies branch from d1edca7 to ce15092 Compare July 27, 2021 17:50

github-actions bot added [Block] Send a message Admin Page React-powered dashboard under the Jetpack menu [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! labels Jul 27, 2021

anomiex added 2 commits July 28, 2021 11:17

Update "validate-es5" to "validate-es9"

e34a689

Babel does less transpilation now that @wordpress/browserslist-config dropped IE11. ES9 is the minimum version that passes now. Longer term we should replace that check with something better. See p9dueE-3fG-p2 for details.

Update Jetpack change entry

949882c

anomiex approved these changes Jul 28, 2021

View reviewed changes

glendaviesnz merged commit 2a320c7 into renovate/wordpress-monorepo Jul 28, 2021

glendaviesnz deleted the fix/extension-tests-for-updated-dependencies branch July 28, 2021 20:53

github-actions bot removed [Status] Needs Author Reply We would need you to make some changes or provide some more details about your PR. Thank you! [Status] Needs Team Review labels Jul 28, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update jetpack extension tests to work with update to @wordpress dependencies #20326

Update jetpack extension tests to work with update to @wordpress dependencies #20326

glendaviesnz commented Jul 11, 2021 •

edited

Loading

github-actions bot commented Jul 11, 2021 •

edited

Loading

ramonjd left a comment

anomiex left a comment •

edited

Loading

anomiex Jul 12, 2021

glendaviesnz Jul 13, 2021

anomiex Jul 12, 2021

glendaviesnz Jul 13, 2021 •

edited

Loading

anomiex Jul 13, 2021

anomiex commented Jul 27, 2021

anomiex commented Jul 27, 2021

glendaviesnz commented Jul 27, 2021 •

edited

Loading

anomiex commented Jul 28, 2021

anomiex left a comment

anomiex commented Jul 29, 2021

Update jetpack extension tests to work with update to @wordpress dependencies #20326

Update jetpack extension tests to work with update to @wordpress dependencies #20326

Conversation

glendaviesnz commented Jul 11, 2021 • edited Loading

Changes proposed in this Pull Request:

Does this pull request change what data or activity we track or use?

Testing instructions:

github-actions bot commented Jul 11, 2021 • edited Loading

ramonjd left a comment

Choose a reason for hiding this comment

anomiex left a comment • edited Loading

Choose a reason for hiding this comment

anomiex Jul 12, 2021

Choose a reason for hiding this comment

glendaviesnz Jul 13, 2021

Choose a reason for hiding this comment

anomiex Jul 12, 2021

Choose a reason for hiding this comment

glendaviesnz Jul 13, 2021 • edited Loading

Choose a reason for hiding this comment

anomiex Jul 13, 2021

Choose a reason for hiding this comment

anomiex commented Jul 27, 2021

anomiex commented Jul 27, 2021

glendaviesnz commented Jul 27, 2021 • edited Loading

anomiex commented Jul 28, 2021

anomiex left a comment

Choose a reason for hiding this comment

anomiex commented Jul 29, 2021

glendaviesnz commented Jul 11, 2021 •

edited

Loading

github-actions bot commented Jul 11, 2021 •

edited

Loading

anomiex left a comment •

edited

Loading

glendaviesnz Jul 13, 2021 •

edited

Loading

glendaviesnz commented Jul 27, 2021 •

edited

Loading