Migrate customizing-widgets to Playwright #39540

kevin940726 · 2022-03-17T09:49:44Z

What?

Based on #38570, part of #38851. Migrate customizing-widgets.test.js to its Playwright counterpart.

Why?

See #38570 for its background and rationale.

This is split into a new PR for easier review.

How?

See #38570 for the proposed migration steps.

Testing Instructions

npm run test-e2e:playwright

github-actions · 2022-03-17T09:59:03Z

Size Change: +6.19 kB (+1%)

Total Size: 1.21 MB

Filename	Size	Change
`build/block-editor/index.min.js`	147 kB	+542 B (0%)
`build/block-editor/style-rtl.css`	15.4 kB	+300 B (+2%)
`build/block-editor/style.css`	15.4 kB	+298 B (+2%)
`build/block-library/editor-rtl.css`	10 kB	+12 B (0%)
`build/block-library/editor.css`	10 kB	+12 B (0%)
`build/block-library/index.min.js`	171 kB	+1.95 kB (+1%)
`build/blocks/index.min.js`	46.8 kB	+33 B (0%)
`build/components/index.min.js`	223 kB	+4.57 kB (+2%)
`build/components/style-rtl.css`	14.9 kB	-718 B (-5%)	✅
`build/components/style.css`	14.9 kB	-718 B (-5%)	✅
`build/core-data/index.min.js`	14.3 kB	-3 B (0%)
`build/customize-widgets/index.min.js`	11 kB	-150 B (-1%)
`build/data/index.min.js`	8.61 kB	+415 B (+5%)	🔍
`build/date/index.min.js`	32 kB	+66 B (0%)
`build/dom/index.min.js`	4.58 kB	+44 B (+1%)
`build/edit-navigation/index.min.js`	15.8 kB	-239 B (-1%)
`build/edit-post/index.min.js`	29.6 kB	-197 B (-1%)
`build/edit-site/index.min.js`	45.2 kB	+196 B (0%)
`build/edit-site/style-rtl.css`	7.6 kB	+20 B (0%)
`build/edit-site/style.css`	7.58 kB	+19 B (0%)
`build/edit-widgets/index.min.js`	16.3 kB	-207 B (-1%)
`build/editor/index.min.js`	38.4 kB	-57 B (0%)
`build/preferences/index.min.js`	1.2 kB	-1 B (0%)

ℹ️ View Unchanged

Filename	Size
`build/a11y/index.min.js`	993 B
`build/admin-manifest/index.min.js`	1.24 kB
`build/annotations/index.min.js`	2.77 kB
`build/api-fetch/index.min.js`	2.27 kB
`build/autop/index.min.js`	2.15 kB
`build/blob/index.min.js`	487 B
`build/block-directory/index.min.js`	6.49 kB
`build/block-directory/style-rtl.css`	1.01 kB
`build/block-directory/style.css`	1.01 kB
`build/block-editor/default-editor-styles-rtl.css`	378 B
`build/block-editor/default-editor-styles.css`	378 B
`build/block-library/blocks/archives/editor-rtl.css`	61 B
`build/block-library/blocks/archives/editor.css`	60 B
`build/block-library/blocks/archives/style-rtl.css`	65 B
`build/block-library/blocks/archives/style.css`	65 B
`build/block-library/blocks/audio/editor-rtl.css`	150 B
`build/block-library/blocks/audio/editor.css`	150 B
`build/block-library/blocks/audio/style-rtl.css`	111 B
`build/block-library/blocks/audio/style.css`	111 B
`build/block-library/blocks/audio/theme-rtl.css`	125 B
`build/block-library/blocks/audio/theme.css`	125 B
`build/block-library/blocks/avatar/editor-rtl.css`	59 B
`build/block-library/blocks/avatar/editor.css`	59 B
`build/block-library/blocks/block/editor-rtl.css`	161 B
`build/block-library/blocks/block/editor.css`	161 B
`build/block-library/blocks/button/editor-rtl.css`	445 B
`build/block-library/blocks/button/editor.css`	445 B
`build/block-library/blocks/button/style-rtl.css`	560 B
`build/block-library/blocks/button/style.css`	560 B
`build/block-library/blocks/buttons/editor-rtl.css`	292 B
`build/block-library/blocks/buttons/editor.css`	292 B
`build/block-library/blocks/buttons/style-rtl.css`	275 B
`build/block-library/blocks/buttons/style.css`	275 B
`build/block-library/blocks/calendar/style-rtl.css`	207 B
`build/block-library/blocks/calendar/style.css`	207 B
`build/block-library/blocks/categories/editor-rtl.css`	84 B
`build/block-library/blocks/categories/editor.css`	83 B
`build/block-library/blocks/categories/style-rtl.css`	79 B
`build/block-library/blocks/categories/style.css`	79 B
`build/block-library/blocks/code/style-rtl.css`	103 B
`build/block-library/blocks/code/style.css`	103 B
`build/block-library/blocks/code/theme-rtl.css`	124 B
`build/block-library/blocks/code/theme.css`	124 B
`build/block-library/blocks/columns/editor-rtl.css`	108 B
`build/block-library/blocks/columns/editor.css`	108 B
`build/block-library/blocks/columns/style-rtl.css`	406 B
`build/block-library/blocks/columns/style.css`	406 B
`build/block-library/blocks/comment-author-avatar/editor-rtl.css`	125 B
`build/block-library/blocks/comment-author-avatar/editor.css`	125 B
`build/block-library/blocks/comment-template/style-rtl.css`	127 B
`build/block-library/blocks/comment-template/style.css`	127 B
`build/block-library/blocks/comments-pagination-numbers/editor-rtl.css`	123 B
`build/block-library/blocks/comments-pagination-numbers/editor.css`	121 B
`build/block-library/blocks/comments-pagination/editor-rtl.css`	222 B
`build/block-library/blocks/comments-pagination/editor.css`	209 B
`build/block-library/blocks/comments-pagination/style-rtl.css`	235 B
`build/block-library/blocks/comments-pagination/style.css`	231 B
`build/block-library/blocks/comments-query-loop/editor-rtl.css`	95 B
`build/block-library/blocks/comments-query-loop/editor.css`	95 B
`build/block-library/blocks/cover/editor-rtl.css`	546 B
`build/block-library/blocks/cover/editor.css`	547 B
`build/block-library/blocks/cover/style-rtl.css`	1.56 kB
`build/block-library/blocks/cover/style.css`	1.56 kB
`build/block-library/blocks/embed/editor-rtl.css`	293 B
`build/block-library/blocks/embed/editor.css`	293 B
`build/block-library/blocks/embed/style-rtl.css`	417 B
`build/block-library/blocks/embed/style.css`	417 B
`build/block-library/blocks/embed/theme-rtl.css`	124 B
`build/block-library/blocks/embed/theme.css`	124 B
`build/block-library/blocks/file/editor-rtl.css`	300 B
`build/block-library/blocks/file/editor.css`	300 B
`build/block-library/blocks/file/style-rtl.css`	255 B
`build/block-library/blocks/file/style.css`	255 B
`build/block-library/blocks/file/view.min.js`	353 B
`build/block-library/blocks/freeform/editor-rtl.css`	2.44 kB
`build/block-library/blocks/freeform/editor.css`	2.44 kB
`build/block-library/blocks/gallery/editor-rtl.css`	961 B
`build/block-library/blocks/gallery/editor.css`	964 B
`build/block-library/blocks/gallery/style-rtl.css`	1.51 kB
`build/block-library/blocks/gallery/style.css`	1.51 kB
`build/block-library/blocks/gallery/theme-rtl.css`	122 B
`build/block-library/blocks/gallery/theme.css`	122 B
`build/block-library/blocks/group/editor-rtl.css`	159 B
`build/block-library/blocks/group/editor.css`	159 B
`build/block-library/blocks/group/style-rtl.css`	57 B
`build/block-library/blocks/group/style.css`	57 B
`build/block-library/blocks/group/theme-rtl.css`	78 B
`build/block-library/blocks/group/theme.css`	78 B
`build/block-library/blocks/heading/style-rtl.css`	114 B
`build/block-library/blocks/heading/style.css`	114 B
`build/block-library/blocks/html/editor-rtl.css`	332 B
`build/block-library/blocks/html/editor.css`	333 B
`build/block-library/blocks/image/editor-rtl.css`	731 B
`build/block-library/blocks/image/editor.css`	730 B
`build/block-library/blocks/image/style-rtl.css`	529 B
`build/block-library/blocks/image/style.css`	535 B
`build/block-library/blocks/image/theme-rtl.css`	124 B
`build/block-library/blocks/image/theme.css`	124 B
`build/block-library/blocks/latest-comments/style-rtl.css`	284 B
`build/block-library/blocks/latest-comments/style.css`	284 B
`build/block-library/blocks/latest-posts/editor-rtl.css`	199 B
`build/block-library/blocks/latest-posts/editor.css`	198 B
`build/block-library/blocks/latest-posts/style-rtl.css`	447 B
`build/block-library/blocks/latest-posts/style.css`	446 B
`build/block-library/blocks/list/style-rtl.css`	94 B
`build/block-library/blocks/list/style.css`	94 B
`build/block-library/blocks/media-text/editor-rtl.css`	266 B
`build/block-library/blocks/media-text/editor.css`	263 B
`build/block-library/blocks/media-text/style-rtl.css`	493 B
`build/block-library/blocks/media-text/style.css`	490 B
`build/block-library/blocks/more/editor-rtl.css`	431 B
`build/block-library/blocks/more/editor.css`	431 B
`build/block-library/blocks/navigation-link/editor-rtl.css`	708 B
`build/block-library/blocks/navigation-link/editor.css`	706 B
`build/block-library/blocks/navigation-link/style-rtl.css`	94 B
`build/block-library/blocks/navigation-link/style.css`	94 B
`build/block-library/blocks/navigation-submenu/editor-rtl.css`	299 B
`build/block-library/blocks/navigation-submenu/editor.css`	299 B
`build/block-library/blocks/navigation-submenu/view.min.js`	375 B
`build/block-library/blocks/navigation/editor-rtl.css`	2.03 kB
`build/block-library/blocks/navigation/editor.css`	2.04 kB
`build/block-library/blocks/navigation/style-rtl.css`	1.89 kB
`build/block-library/blocks/navigation/style.css`	1.88 kB
`build/block-library/blocks/navigation/view.min.js`	2.85 kB
`build/block-library/blocks/nextpage/editor-rtl.css`	395 B
`build/block-library/blocks/nextpage/editor.css`	395 B
`build/block-library/blocks/page-list/editor-rtl.css`	363 B
`build/block-library/blocks/page-list/editor.css`	363 B
`build/block-library/blocks/page-list/style-rtl.css`	175 B
`build/block-library/blocks/page-list/style.css`	175 B
`build/block-library/blocks/paragraph/editor-rtl.css`	157 B
`build/block-library/blocks/paragraph/editor.css`	157 B
`build/block-library/blocks/paragraph/style-rtl.css`	273 B
`build/block-library/blocks/paragraph/style.css`	273 B
`build/block-library/blocks/post-author/style-rtl.css`	175 B
`build/block-library/blocks/post-author/style.css`	176 B
`build/block-library/blocks/post-comments-form/style-rtl.css`	446 B
`build/block-library/blocks/post-comments-form/style.css`	446 B
`build/block-library/blocks/post-comments/style-rtl.css`	521 B
`build/block-library/blocks/post-comments/style.css`	521 B
`build/block-library/blocks/post-excerpt/editor-rtl.css`	73 B
`build/block-library/blocks/post-excerpt/editor.css`	73 B
`build/block-library/blocks/post-excerpt/style-rtl.css`	69 B
`build/block-library/blocks/post-excerpt/style.css`	69 B
`build/block-library/blocks/post-featured-image/editor-rtl.css`	721 B
`build/block-library/blocks/post-featured-image/editor.css`	721 B
`build/block-library/blocks/post-featured-image/style-rtl.css`	153 B
`build/block-library/blocks/post-featured-image/style.css`	153 B
`build/block-library/blocks/post-template/editor-rtl.css`	99 B
`build/block-library/blocks/post-template/editor.css`	98 B
`build/block-library/blocks/post-template/style-rtl.css`	323 B
`build/block-library/blocks/post-template/style.css`	323 B
`build/block-library/blocks/post-terms/style-rtl.css`	73 B
`build/block-library/blocks/post-terms/style.css`	73 B
`build/block-library/blocks/post-title/style-rtl.css`	80 B
`build/block-library/blocks/post-title/style.css`	80 B
`build/block-library/blocks/preformatted/style-rtl.css`	103 B
`build/block-library/blocks/preformatted/style.css`	103 B
`build/block-library/blocks/pullquote/editor-rtl.css`	198 B
`build/block-library/blocks/pullquote/editor.css`	198 B
`build/block-library/blocks/pullquote/style-rtl.css`	370 B
`build/block-library/blocks/pullquote/style.css`	370 B
`build/block-library/blocks/pullquote/theme-rtl.css`	167 B
`build/block-library/blocks/pullquote/theme.css`	167 B
`build/block-library/blocks/query-pagination-numbers/editor-rtl.css`	122 B
`build/block-library/blocks/query-pagination-numbers/editor.css`	121 B
`build/block-library/blocks/query-pagination/editor-rtl.css`	221 B
`build/block-library/blocks/query-pagination/editor.css`	211 B
`build/block-library/blocks/query-pagination/style-rtl.css`	234 B
`build/block-library/blocks/query-pagination/style.css`	231 B
`build/block-library/blocks/query/editor-rtl.css`	131 B
`build/block-library/blocks/query/editor.css`	132 B
`build/block-library/blocks/quote/style-rtl.css`	201 B
`build/block-library/blocks/quote/style.css`	201 B
`build/block-library/blocks/quote/theme-rtl.css`	223 B
`build/block-library/blocks/quote/theme.css`	226 B
`build/block-library/blocks/read-more/style-rtl.css`	132 B
`build/block-library/blocks/read-more/style.css`	132 B
`build/block-library/blocks/rss/editor-rtl.css`	202 B
`build/block-library/blocks/rss/editor.css`	204 B
`build/block-library/blocks/rss/style-rtl.css`	289 B
`build/block-library/blocks/rss/style.css`	288 B
`build/block-library/blocks/search/editor-rtl.css`	165 B
`build/block-library/blocks/search/editor.css`	165 B
`build/block-library/blocks/search/style-rtl.css`	397 B
`build/block-library/blocks/search/style.css`	398 B
`build/block-library/blocks/search/theme-rtl.css`	64 B
`build/block-library/blocks/search/theme.css`	64 B
`build/block-library/blocks/separator/editor-rtl.css`	140 B
`build/block-library/blocks/separator/editor.css`	140 B
`build/block-library/blocks/separator/style-rtl.css`	233 B
`build/block-library/blocks/separator/style.css`	233 B
`build/block-library/blocks/separator/theme-rtl.css`	194 B
`build/block-library/blocks/separator/theme.css`	194 B
`build/block-library/blocks/shortcode/editor-rtl.css`	474 B
`build/block-library/blocks/shortcode/editor.css`	474 B
`build/block-library/blocks/site-logo/editor-rtl.css`	759 B
`build/block-library/blocks/site-logo/editor.css`	759 B
`build/block-library/blocks/site-logo/style-rtl.css`	181 B
`build/block-library/blocks/site-logo/style.css`	181 B
`build/block-library/blocks/site-tagline/editor-rtl.css`	86 B
`build/block-library/blocks/site-tagline/editor.css`	86 B
`build/block-library/blocks/site-title/editor-rtl.css`	84 B
`build/block-library/blocks/site-title/editor.css`	84 B
`build/block-library/blocks/social-link/editor-rtl.css`	177 B
`build/block-library/blocks/social-link/editor.css`	177 B
`build/block-library/blocks/social-links/editor-rtl.css`	674 B
`build/block-library/blocks/social-links/editor.css`	673 B
`build/block-library/blocks/social-links/style-rtl.css`	1.37 kB
`build/block-library/blocks/social-links/style.css`	1.36 kB
`build/block-library/blocks/spacer/editor-rtl.css`	332 B
`build/block-library/blocks/spacer/editor.css`	332 B
`build/block-library/blocks/spacer/style-rtl.css`	48 B
`build/block-library/blocks/spacer/style.css`	48 B
`build/block-library/blocks/table/editor-rtl.css`	471 B
`build/block-library/blocks/table/editor.css`	472 B
`build/block-library/blocks/table/style-rtl.css`	481 B
`build/block-library/blocks/table/style.css`	481 B
`build/block-library/blocks/table/theme-rtl.css`	188 B
`build/block-library/blocks/table/theme.css`	188 B
`build/block-library/blocks/tag-cloud/style-rtl.css`	226 B
`build/block-library/blocks/tag-cloud/style.css`	227 B
`build/block-library/blocks/template-part/editor-rtl.css`	235 B
`build/block-library/blocks/template-part/editor.css`	235 B
`build/block-library/blocks/template-part/theme-rtl.css`	101 B
`build/block-library/blocks/template-part/theme.css`	101 B
`build/block-library/blocks/text-columns/editor-rtl.css`	95 B
`build/block-library/blocks/text-columns/editor.css`	95 B
`build/block-library/blocks/text-columns/style-rtl.css`	166 B
`build/block-library/blocks/text-columns/style.css`	166 B
`build/block-library/blocks/verse/style-rtl.css`	87 B
`build/block-library/blocks/verse/style.css`	87 B
`build/block-library/blocks/video/editor-rtl.css`	571 B
`build/block-library/blocks/video/editor.css`	572 B
`build/block-library/blocks/video/style-rtl.css`	173 B
`build/block-library/blocks/video/style.css`	173 B
`build/block-library/blocks/video/theme-rtl.css`	124 B
`build/block-library/blocks/video/theme.css`	124 B
`build/block-library/common-rtl.css`	934 B
`build/block-library/common.css`	932 B
`build/block-library/reset-rtl.css`	474 B
`build/block-library/reset.css`	474 B
`build/block-library/style-rtl.css`	11.2 kB
`build/block-library/style.css`	11.2 kB
`build/block-library/theme-rtl.css`	689 B
`build/block-library/theme.css`	694 B
`build/block-serialization-default-parser/index.min.js`	1.12 kB
`build/block-serialization-spec-parser/index.min.js`	2.83 kB
`build/compose/index.min.js`	11.2 kB
`build/customize-widgets/style-rtl.css`	1.39 kB
`build/customize-widgets/style.css`	1.39 kB
`build/data-controls/index.min.js`	663 B
`build/deprecated/index.min.js`	518 B
`build/dom-ready/index.min.js`	336 B
`build/edit-navigation/style-rtl.css`	4.04 kB
`build/edit-navigation/style.css`	4.05 kB
`build/edit-post/classic-rtl.css`	546 B
`build/edit-post/classic.css`	547 B
`build/edit-post/style-rtl.css`	7.07 kB
`build/edit-post/style.css`	7.07 kB
`build/edit-widgets/style-rtl.css`	4.4 kB
`build/edit-widgets/style.css`	4.39 kB
`build/editor/style-rtl.css`	3.71 kB
`build/editor/style.css`	3.71 kB
`build/element/index.min.js`	4.29 kB
`build/escape-html/index.min.js`	548 B
`build/format-library/index.min.js`	6.62 kB
`build/format-library/style-rtl.css`	571 B
`build/format-library/style.css`	571 B
`build/hooks/index.min.js`	1.66 kB
`build/html-entities/index.min.js`	454 B
`build/i18n/index.min.js`	3.79 kB
`build/is-shallow-equal/index.min.js`	535 B
`build/keyboard-shortcuts/index.min.js`	1.83 kB
`build/keycodes/index.min.js`	1.41 kB
`build/list-reusable-blocks/index.min.js`	1.75 kB
`build/list-reusable-blocks/style-rtl.css`	838 B
`build/list-reusable-blocks/style.css`	838 B
`build/media-utils/index.min.js`	2.94 kB
`build/notices/index.min.js`	957 B
`build/nux/index.min.js`	2.12 kB
`build/nux/style-rtl.css`	751 B
`build/nux/style.css`	749 B
`build/plugins/index.min.js`	1.98 kB
`build/primitives/index.min.js`	949 B
`build/priority-queue/index.min.js`	611 B
`build/react-i18n/index.min.js`	704 B
`build/react-refresh-entry/index.min.js`	8.44 kB
`build/react-refresh-runtime/index.min.js`	7.31 kB
`build/redux-routine/index.min.js`	2.69 kB
`build/reusable-blocks/index.min.js`	2.24 kB
`build/reusable-blocks/style-rtl.css`	256 B
`build/reusable-blocks/style.css`	256 B
`build/rich-text/index.min.js`	11.1 kB
`build/server-side-render/index.min.js`	1.61 kB
`build/shortcode/index.min.js`	1.52 kB
`build/token-list/index.min.js`	668 B
`build/url/index.min.js`	1.99 kB
`build/vendors/react-dom.min.js`	38.5 kB
`build/vendors/react.min.js`	4.34 kB
`build/viewport/index.min.js`	1.08 kB
`build/warning/index.min.js`	280 B
`build/widgets/index.min.js`	7.21 kB
`build/widgets/style-rtl.css`	1.16 kB
`build/widgets/style.css`	1.16 kB
`build/wordcount/index.min.js`	1.07 kB

_{compressed-size-action}

noisysocks

The tests are ✅ and the code looks 🔥!

noisysocks · 2022-03-24T04:57:21Z

Should we remove the sanity E2E test?

kevin940726 · 2022-03-28T07:48:01Z

Should we remove the sanity E2E test?

Yep yep, we should!

kevin940726 requested review from ntwb, nerrad, ajitbohra and noisysocks March 17, 2022 09:49

kevin940726 force-pushed the try/playwright-test branch from eb158c9 to 68b1690 Compare March 17, 2022 16:59

kevin940726 requested review from gziolo, mkaz, ryanwelcher and juanmaguitar as code owners March 17, 2022 16:59

kevin940726 force-pushed the add/playwright-customizing-widgets branch from 38395d5 to 3b1674a Compare March 17, 2022 16:59

kevin940726 mentioned this pull request Mar 18, 2022

Add infrastructure for writing Playwright E2E tests #38570

Merged

8 tasks

kevin940726 added the [Type] Automated Testing Testing infrastructure changes impacting the execution of end-to-end (E2E) and/or unit tests. label Mar 18, 2022

kevin940726 force-pushed the add/playwright-customizing-widgets branch from 3b1674a to 82fb9e6 Compare March 22, 2022 08:46

kevin940726 mentioned this pull request Mar 22, 2022

Migrate E2E tests to Playwright #38851

Closed

Base automatically changed from try/playwright-test to trunk March 22, 2022 10:03

kevin940726 and others added 2 commits March 22, 2022 21:33

Migrate customizing-widgets to Playwright

434c439

Fix sidebar reduce motion in customizer

c73acec

kevin940726 force-pushed the add/playwright-customizing-widgets branch from 82fb9e6 to c73acec Compare March 22, 2022 13:33

noisysocks approved these changes Mar 24, 2022

View reviewed changes

Delete sanity test

15c1c68

kevin940726 merged commit 9f5b842 into trunk Mar 28, 2022

kevin940726 deleted the add/playwright-customizing-widgets branch March 28, 2022 08:30

github-actions bot added this to the Gutenberg 13.0 milestone Mar 28, 2022

This was referenced Apr 7, 2022

[Flaky Test] should handle legacy widgets #39133

Open

[Flaky Test] should move focus to the block #38832

Open

[Flaky Test] should handle the inserter outer section #38757

Open

[Flaky Test] should add blocks #35373

Closed

This was referenced Apr 7, 2022

[Flaky Test] should handle esc key events #35496

Closed

[Flaky Test] should clear block selection #38676

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Migrate customizing-widgets to Playwright #39540

Migrate customizing-widgets to Playwright #39540

kevin940726 commented Mar 17, 2022 •

edited

Loading

github-actions bot commented Mar 17, 2022 •

edited

Loading

noisysocks left a comment

noisysocks commented Mar 24, 2022

kevin940726 commented Mar 28, 2022

Migrate customizing-widgets to Playwright #39540

Migrate customizing-widgets to Playwright #39540

Conversation

kevin940726 commented Mar 17, 2022 • edited Loading

What?

Why?

How?

Testing Instructions

github-actions bot commented Mar 17, 2022 • edited Loading

noisysocks left a comment

Choose a reason for hiding this comment

noisysocks commented Mar 24, 2022

kevin940726 commented Mar 28, 2022

kevin940726 commented Mar 17, 2022 •

edited

Loading

github-actions bot commented Mar 17, 2022 •

edited

Loading