Update e2e tests to reflect that drafts are now part of post status

[olaseni]

Fixes: #90290
Related: WordPress/gutenberg#60456

The UI for unpublishing a post has changed such that you now have to interact with the post status panel pop out. Also, the Update CTA text has changed to save

This is currently breaking some nightly e2e tests for Gutenberg. This change modifies the e2e's expectations to fit the new realities.

Testing instructions

Running e2e tests for Calypso

Run the page basic flow e2e edge tests for Simple and AT sites, which were failing before this fix:

cd test/e2e
yarn jest --clearCache && yarn build 
GUTENBERG_EDGE=1 yarn jest specs/editor/editor__post-advanced-flow.ts
GUTENBERG_EDGE=1 TEST_ON_ATOMIC=true yarn jest specs/editor/editor__post-advanced-flow.ts

[matticbot]

This PR does not affect the size of JS and CSS bundles shipped to the user's browser.

Generated by performance advisor bot at iscalypsofastyet.com.

[github-actions]

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-106445

Jetpack Cloud live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-106445&env=jetpack

Automattic for Agencies live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-106445&env=a8c-for-agencies

[matticbot]

This PR modifies the release build for the following Calypso Apps:

For info about this notification, see here: PCYsg-OT6-p2

• wpcom-block-editor

To test WordPress.com changes, run install-plugin.sh $pluginSlug fix/update-e2e-where-drafts-are-now-part-of-post-status on your sandbox.

[fredrikekelund]

Changes make sense and work as expected 👍

I left one comment that would be good to resolve before landing, though

[fredrikekelund]

Why do we need both these calls? They seem to accomplish the same thing 🤔

The test also seems to complete successfully (on Simple and on Atomic) with only one of these lines.

[olaseni]

Actually the edge versions on simple and AT are the same and you won't notice a difference there. There are both running 18.2.0.

For versions before i.e. 18.1.2, which is what ordinary sites ( non-edge sites ) are using.

You can test this with:

yarn jest specs/editor/editor__post-advanced-flow.ts

... without the GUTENBERG_EDGE=1 or TEST_ON_ATOMIC=true. Apologies for not leaving this in the description.

The UI for that version is different. That OK button is only present there.

Without using Promise.race() with those two lines, you'll get this error:

  ● Editor: Advanced Post Flow › Revert post to draft › Switch to draft

    locator.click: Timeout 10000ms exceeded.
    =========================== logs ===========================
    waiting for frameLocator('iframe[src*="calypsoify"]').locator('body.block-editor-page').locator('.interface-navigable-region[class*="header"] button.editor-post-publish-button__button[aria-disabled="false"]')
    ============================================================

      276 | 		const editorParent = await this.editor.parent();
      277 | 		const publishButtonLocator = editorParent.locator( selectors.publishButton( 'enabled' ) );
    > 278 | 		await publishButtonLocator.click();
          | 		                           ^
      279 | 	}
      280 |
      281 | 	/**

      at EditorToolbarComponent.click [as clickPublish] (../../packages/calypso-e2e/src/lib/components/editor-toolbar-component.ts:278:30)
      at EditorPage.unpublish (../../packages/calypso-e2e/src/lib/pages/editor-page.ts:775:3)
      at Object.<anonymous> (specs/editor/editor__post-advanced-flow.ts:155:4)

[fredrikekelund]

Gotcha! I think I simply forgot to build after making my changes to the tests, or they wouldn't have passed 🤦‍♂️

[fredrikekelund]

LGTM 👍

[fredrikekelund]

Gotcha! I think I simply forgot to build after making my changes to the tests, or they wouldn't have passed 🤦‍♂️