From b4424d8c2c6b6c95a973383abe5650c8aac73107 Mon Sep 17 00:00:00 2001 From: Utsav Patel <75293077+up1512001@users.noreply.github.com> Date: Fri, 27 Dec 2024 14:43:28 +0530 Subject: [PATCH 1/7] Video Block: refactor setting panel (#67044) Co-authored-by: up1512001 Co-authored-by: aaronrobertshaw Co-authored-by: t-hamano --- .../src/video/edit-common-settings.js | 136 +++++++++++++----- packages/block-library/src/video/edit.js | 104 ++++---------- .../block-library/src/video/poster-image.js | 86 +++++++++++ 3 files changed, 212 insertions(+), 114 deletions(-) create mode 100644 packages/block-library/src/video/poster-image.js diff --git a/packages/block-library/src/video/edit-common-settings.js b/packages/block-library/src/video/edit-common-settings.js index 9394bfaf5c6145..4f85f929b07cfc 100644 --- a/packages/block-library/src/video/edit-common-settings.js +++ b/packages/block-library/src/video/edit-common-settings.js @@ -2,7 +2,11 @@ * WordPress dependencies */ import { __, _x } from '@wordpress/i18n'; -import { ToggleControl, SelectControl } from '@wordpress/components'; +import { + ToggleControl, + SelectControl, + __experimentalToolsPanelItem as ToolsPanelItem, +} from '@wordpress/components'; import { useMemo, useCallback, Platform } from '@wordpress/element'; const options = [ @@ -47,50 +51,104 @@ const VideoSettings = ( { setAttributes, attributes } ) => { return ( <> - - !! autoplay } + onDeselect={ () => { + setAttributes( { autoplay: false } ); + } } + > + + + - !! loop } + onDeselect={ () => { + setAttributes( { loop: false } ); + } } + > + + + - !! muted } + onDeselect={ () => { + setAttributes( { muted: false } ); + } } + > + + + - ! controls } + onDeselect={ () => { + setAttributes( { controls: true } ); + } } + > + + + - !! playsInline } + onDeselect={ () => { + setAttributes( { playsInline: false } ); + } } + > + + + + isShownByDefault + hasValue={ () => preload !== 'metadata' } + onDeselect={ () => { + setAttributes( { preload: 'metadata' } ); + } } + > + + ); }; diff --git a/packages/block-library/src/video/edit.js b/packages/block-library/src/video/edit.js index 32221919c7ea20..95ecab25f95985 100644 --- a/packages/block-library/src/video/edit.js +++ b/packages/block-library/src/video/edit.js @@ -8,25 +8,21 @@ import clsx from 'clsx'; */ import { isBlobURL } from '@wordpress/blob'; import { - BaseControl, - Button, Disabled, - PanelBody, Spinner, Placeholder, + __experimentalToolsPanel as ToolsPanel, } from '@wordpress/components'; import { BlockControls, BlockIcon, InspectorControls, MediaPlaceholder, - MediaUpload, - MediaUploadCheck, MediaReplaceFlow, useBlockProps, } from '@wordpress/block-editor'; import { useRef, useEffect, useState } from '@wordpress/element'; -import { __, sprintf } from '@wordpress/i18n'; +import { __ } from '@wordpress/i18n'; import { useInstanceId } from '@wordpress/compose'; import { useDispatch } from '@wordpress/data'; import { video as icon } from '@wordpress/icons'; @@ -35,15 +31,18 @@ import { store as noticesStore } from '@wordpress/notices'; /** * Internal dependencies */ +import PosterImage from './poster-image'; import { createUpgradedEmbedBlock } from '../embed/util'; -import { useUploadMediaFromBlobURL } from '../utils/hooks'; +import { + useUploadMediaFromBlobURL, + useToolsPanelDropdownMenuProps, +} from '../utils/hooks'; import VideoCommonSettings from './edit-common-settings'; import TracksEditor from './tracks-editor'; import Tracks from './tracks'; import { Caption } from '../utils/caption'; const ALLOWED_MEDIA_TYPES = [ 'video' ]; -const VIDEO_POSTER_ALLOWED_MEDIA_TYPES = [ 'image' ]; function VideoEdit( { isSelected: isSingleSelected, @@ -55,9 +54,9 @@ function VideoEdit( { } ) { const instanceId = useInstanceId( VideoEdit ); const videoPlayer = useRef(); - const posterImageButton = useRef(); const { id, controls, poster, src, tracks } = attributes; const [ temporaryURL, setTemporaryURL ] = useState( attributes.blob ); + const dropdownMenuProps = useToolsPanelDropdownMenuProps(); useUploadMediaFromBlobURL( { url: temporaryURL, @@ -174,19 +173,6 @@ function VideoEdit( { ); } - function onSelectPoster( image ) { - setAttributes( { poster: image.url } ); - } - - function onRemovePoster() { - setAttributes( { poster: undefined } ); - - // Move focus back to the Media Upload button. - posterImageButton.current.focus(); - } - - const videoPosterDescription = `video-block__poster-image-description-${ instanceId }`; - return ( <> { isSingleSelected && ( @@ -214,63 +200,31 @@ function VideoEdit( { ) } - + { + setAttributes( { + autoplay: false, + controls: true, + loop: false, + muted: false, + playsInline: false, + preload: 'metadata', + poster: '', + } ); + } } + dropdownMenuProps={ dropdownMenuProps } + > - -
- - { __( 'Poster image' ) } - - ( - - ) } - /> - - { !! poster && ( - - ) } -
- - + +
{ /* diff --git a/packages/block-library/src/video/poster-image.js b/packages/block-library/src/video/poster-image.js new file mode 100644 index 00000000000000..cde95f974d8e69 --- /dev/null +++ b/packages/block-library/src/video/poster-image.js @@ -0,0 +1,86 @@ +/** + * WordPress dependencies + */ +import { MediaUpload, MediaUploadCheck } from '@wordpress/block-editor'; +import { + Button, + BaseControl, + __experimentalToolsPanelItem as ToolsPanelItem, +} from '@wordpress/components'; +import { __, sprintf } from '@wordpress/i18n'; +import { useRef } from '@wordpress/element'; + +function PosterImage( { poster, setAttributes, instanceId } ) { + const posterImageButton = useRef(); + const VIDEO_POSTER_ALLOWED_MEDIA_TYPES = [ 'image' ]; + + const videoPosterDescription = `video-block__poster-image-description-${ instanceId }`; + + function onSelectPoster( image ) { + setAttributes( { poster: image.url } ); + } + + function onRemovePoster() { + setAttributes( { poster: undefined } ); + + // Move focus back to the Media Upload button. + posterImageButton.current.focus(); + } + + return ( + !! poster } + onDeselect={ () => { + setAttributes( { poster: '' } ); + } } + > + +
+ + { __( 'Poster image' ) } + + ( + + ) } + /> + + { !! poster && ( + + ) } +
+ + + ); +} + +export default PosterImage; From 5c7f039bf6804449ec09723f37179d76355c14d7 Mon Sep 17 00:00:00 2001 From: George Mamadashvili Date: Fri, 27 Dec 2024 13:26:46 +0400 Subject: [PATCH 2/7] Media & Text: Optimize block editor store subscriptions (#68290) * Media & Text: Optimize block editor store subscriptions * Colocate media details store selectors * Set default value Co-authored-by: Mamaduka --- packages/block-library/src/media-text/edit.js | 66 ++++++++++++------- 1 file changed, 43 insertions(+), 23 deletions(-) diff --git a/packages/block-library/src/media-text/edit.js b/packages/block-library/src/media-text/edit.js index cebb2f8d52ae1b..820c7927303114 100644 --- a/packages/block-library/src/media-text/edit.js +++ b/packages/block-library/src/media-text/edit.js @@ -134,6 +134,32 @@ function attributesFromMedia( { }; } +function MediaTextResolutionTool( { image, value, onChange } ) { + const { imageSizes } = useSelect( ( select ) => { + const { getSettings } = select( blockEditorStore ); + return { + imageSizes: getSettings().imageSizes, + }; + }, [] ); + + if ( ! imageSizes?.length ) { + return null; + } + + const imageSizeOptions = imageSizes + .filter( ( { slug } ) => getImageSourceUrlBySizeSlug( image, slug ) ) + .map( ( { name, slug } ) => ( { value: slug, label: name } ) ); + + return ( + + ); +} + function MediaTextEdit( { attributes, isSelected, @@ -154,12 +180,12 @@ function MediaTextEdit( { mediaType, mediaUrl, mediaWidth, + mediaSizeSlug, rel, verticalAlignment, allowedBlocks, useFeaturedImage, } = attributes; - const mediaSizeSlug = attributes.mediaSizeSlug || DEFAULT_MEDIA_SIZE_SLUG; const [ featuredImage ] = useEntityProp( 'postType', @@ -182,6 +208,20 @@ function MediaTextEdit( { [ featuredImage, useFeaturedImage ] ); + const { image } = useSelect( + ( select ) => { + return { + image: + mediaId && isSelected + ? select( coreStore ).getMedia( mediaId, { + context: 'view', + } ) + : null, + }; + }, + [ isSelected, mediaId ] + ); + const featuredImageURL = useFeaturedImage ? featuredImageMedia?.source_url : ''; @@ -206,22 +246,6 @@ function MediaTextEdit( { } ); }; - const { imageSizes, image } = useSelect( - ( select ) => { - const { getSettings } = select( blockEditorStore ); - return { - image: - mediaId && isSelected - ? select( coreStore ).getMedia( mediaId, { - context: 'view', - } ) - : null, - imageSizes: getSettings()?.imageSizes, - }; - }, - [ isSelected, mediaId ] - ); - const refMedia = useRef(); const imperativeFocalPointPreview = ( value ) => { const { style } = refMedia.current; @@ -269,10 +293,6 @@ function MediaTextEdit( { const onVerticalAlignmentChange = ( alignment ) => { setAttributes( { verticalAlignment: alignment } ); }; - - const imageSizeOptions = imageSizes - .filter( ( { slug } ) => getImageSourceUrlBySizeSlug( image, slug ) ) - .map( ( { name, slug } ) => ( { value: slug, label: name } ) ); const updateImage = ( newMediaSizeSlug ) => { const newUrl = getImageSourceUrlBySizeSlug( image, newMediaSizeSlug ); @@ -418,9 +438,9 @@ function MediaTextEdit( { ) } { mediaType === 'image' && ! useFeaturedImage && ( - ) } From a34eaca990facbfe1f981f39a9667432ccc6163f Mon Sep 17 00:00:00 2001 From: Ankit Kumar Shah Date: Fri, 27 Dec 2024 17:20:14 +0530 Subject: [PATCH 3/7] Table Block: Fix margin/padding to include caption in spacing (#68281) * Table Block: Apply margin styles to figure wrapper instead of table element * Table Block: Use Block Selectors API for margin styles * Migrate table block to use standardized selectors Co-authored-by: Infinite-Null Co-authored-by: t-hamano Co-authored-by: yogeshbhutkar Co-authored-by: andersnoren --- packages/block-library/src/table/block.json | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/table/block.json b/packages/block-library/src/table/block.json index 11dd5b5f323e3b..2f0ea753f6f8de 100644 --- a/packages/block-library/src/table/block.json +++ b/packages/block-library/src/table/block.json @@ -195,11 +195,14 @@ "width": true } }, - "__experimentalSelector": ".wp-block-table > table", "interactivity": { "clientNavigation": true } }, + "selectors": { + "root": ".wp-block-table > table", + "spacing": ".wp-block-table" + }, "styles": [ { "name": "regular", From af49fcb8a20d10b27e2619c1e910ea03d9bae078 Mon Sep 17 00:00:00 2001 From: Himanshu Pathak Date: Fri, 27 Dec 2024 17:29:02 +0530 Subject: [PATCH 4/7] Storybook: Add stories for the ContrastChecker component (#68120) * Storybook: Add stories for the contrast-checker component * Storybook: Add default color values for initial component visibility Co-authored-by: himanshupathak95 Co-authored-by: t-hamano --- .../contrast-checker/stories/index.story.js | 117 ++++++++++++++++++ 1 file changed, 117 insertions(+) create mode 100644 packages/block-editor/src/components/contrast-checker/stories/index.story.js diff --git a/packages/block-editor/src/components/contrast-checker/stories/index.story.js b/packages/block-editor/src/components/contrast-checker/stories/index.story.js new file mode 100644 index 00000000000000..4518ab2ba7cd67 --- /dev/null +++ b/packages/block-editor/src/components/contrast-checker/stories/index.story.js @@ -0,0 +1,117 @@ +/** + * Internal dependencies + */ +import ContrastChecker from '../'; + +const meta = { + title: 'BlockEditor/ContrastChecker', + component: ContrastChecker, + parameters: { + docs: { + canvas: { sourceState: 'shown' }, + description: { + component: + 'Determines if contrast for text styles is sufficient (WCAG 2.0 AA) when used with a given background color.', + }, + }, + }, + argTypes: { + backgroundColor: { + control: 'color', + description: + 'The background color to check the contrast of text against.', + table: { + type: { + summary: 'string', + }, + }, + }, + fallbackBackgroundColor: { + control: 'color', + description: + 'A fallback background color value, in case `backgroundColor` is not available.', + table: { + type: { + summary: 'string', + }, + }, + }, + textColor: { + control: 'color', + description: + 'The text color to check the contrast of the background against.', + table: { + type: { + summary: 'string', + }, + }, + }, + fallbackTextColor: { + control: 'color', + description: + 'A fallback text color value, in case `textColor` is not available.', + table: { + type: { + summary: 'string', + }, + }, + }, + fontSize: { + control: 'number', + description: + 'The font-size (as a `px` value) of the text to check the contrast against.', + table: { + type: { + summary: 'number', + }, + }, + }, + isLargeText: { + control: 'boolean', + description: + 'Whether the text is large (approximately `24px` or higher).', + table: { + type: { + summary: 'boolean', + }, + }, + }, + linkColor: { + control: 'color', + description: 'The link color to check the contrast against.', + table: { + type: { + summary: 'string', + }, + }, + }, + fallbackLinkColor: { + control: 'color', + description: 'Fallback link color if linkColor is not available.', + table: { + type: { + summary: 'string', + }, + }, + }, + enableAlphaChecker: { + control: 'boolean', + description: 'Whether to enable checking for transparent colors.', + table: { + type: { + summary: 'boolean', + }, + defaultValue: { summary: false }, + }, + }, + }, +}; + +export default meta; + +export const Default = { + args: { + backgroundColor: '#ffffff', + textColor: '#ffffff', + }, +}; From 80e79916a27f6142bb4d1b035875a57b4b74da0f Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 27 Dec 2024 04:05:36 -0800 Subject: [PATCH 5/7] Remove jsconfig.json to improve VS Code performance (#68347) --- jsconfig.json | 15 --------------- 1 file changed, 15 deletions(-) delete mode 100644 jsconfig.json diff --git a/jsconfig.json b/jsconfig.json deleted file mode 100644 index 204c9955c3cff1..00000000000000 --- a/jsconfig.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "compilerOptions": { - "baseUrl": ".", - "paths": { - "@wordpress/*": [ "./*", "./packages/*/src" ] - } - }, - "exclude": [ - "build", - "build-module", - "node_modules", - "packages/e2e-tests/plugins", - "vendor" - ] -} From f1fadbb036f1e702e3a28072444fd0de28a5dc02 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 27 Dec 2024 04:42:30 -0800 Subject: [PATCH 6/7] Fix tsconfig for test/ directory (#68346) * Add @types/node for test/ directory files * Update tsconfig for e2e and performance test directories * Add test/e2e and test/performance to root tsconfig references * Expect TS error * Remove declaration files * Clean up tsconfig * Use @types/node v 20 * Use a hack instead of ts-expect-error --- package-lock.json | 153 +++++++++--------- package.json | 1 + test/e2e/playwright.config.ts | 2 +- .../e2e/specs/interactivity/fixtures/index.ts | 4 +- test/e2e/tsconfig.json | 8 +- test/performance/playwright.config.ts | 2 +- test/performance/tsconfig.json | 8 +- tsconfig.json | 4 +- 8 files changed, 94 insertions(+), 88 deletions(-) diff --git a/package-lock.json b/package-lock.json index b3632a1be21090..057ccb17acc0b9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -56,6 +56,7 @@ "@types/estree": "1.0.5", "@types/istanbul-lib-report": "3.0.0", "@types/mime": "2.0.3", + "@types/node": "20.17.10", "@types/npm-package-arg": "6.1.1", "@types/prettier": "2.4.4", "@types/qs": "6.9.7", @@ -11841,6 +11842,16 @@ } } }, + "node_modules/@storybook/builder-webpack5/node_modules/@types/node": { + "version": "22.10.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.2.tgz", + "integrity": "sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "undici-types": "~6.20.0" + } + }, "node_modules/@storybook/builder-webpack5/node_modules/css-loader": { "version": "6.11.0", "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.11.0.tgz", @@ -11904,6 +11915,13 @@ "webpack": "^5.0.0" } }, + "node_modules/@storybook/builder-webpack5/node_modules/undici-types": { + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", + "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==", + "dev": true, + "license": "MIT" + }, "node_modules/@storybook/builder-webpack5/node_modules/util": { "version": "0.12.5", "resolved": "https://registry.npmjs.org/util/-/util-0.12.5.tgz", @@ -11978,6 +11996,23 @@ "storybook": "^8.4.7" } }, + "node_modules/@storybook/core-webpack/node_modules/@types/node": { + "version": "22.10.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.2.tgz", + "integrity": "sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "undici-types": "~6.20.0" + } + }, + "node_modules/@storybook/core-webpack/node_modules/undici-types": { + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", + "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==", + "dev": true, + "license": "MIT" + }, "node_modules/@storybook/core/node_modules/recast": { "version": "0.23.9", "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.9.tgz", @@ -12190,6 +12225,16 @@ } } }, + "node_modules/@storybook/preset-react-webpack/node_modules/@types/node": { + "version": "22.10.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.2.tgz", + "integrity": "sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "undici-types": "~6.20.0" + } + }, "node_modules/@storybook/preset-react-webpack/node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -12268,6 +12313,13 @@ "node": ">=6" } }, + "node_modules/@storybook/preset-react-webpack/node_modules/undici-types": { + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", + "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==", + "dev": true, + "license": "MIT" + }, "node_modules/@storybook/preview-api": { "version": "8.4.7", "resolved": "https://registry.npmjs.org/@storybook/preview-api/-/preview-api-8.4.7.tgz", @@ -12504,6 +12556,23 @@ } } }, + "node_modules/@storybook/react-webpack5/node_modules/@types/node": { + "version": "22.10.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.2.tgz", + "integrity": "sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "undici-types": "~6.20.0" + } + }, + "node_modules/@storybook/react-webpack5/node_modules/undici-types": { + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", + "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==", + "dev": true, + "license": "MIT" + }, "node_modules/@storybook/source-loader": { "version": "8.4.7", "resolved": "https://registry.npmjs.org/@storybook/source-loader/-/source-loader-8.4.7.tgz", @@ -13849,11 +13918,12 @@ } }, "node_modules/@types/node": { - "version": "22.10.2", - "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.2.tgz", - "integrity": "sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==", + "version": "20.17.10", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.10.tgz", + "integrity": "sha512-/jrvh5h6NXhEauFFexRin69nA0uHJ5gwk4iDivp/DeoEua3uwCUto6PC86IpRITBOs4+6i2I56K5x5b6WYGXHA==", + "license": "MIT", "dependencies": { - "undici-types": "~6.20.0" + "undici-types": "~6.19.2" } }, "node_modules/@types/node-forge": { @@ -15202,23 +15272,6 @@ "node": "^16.13 || >=18" } }, - "node_modules/@wdio/repl/node_modules/@types/node": { - "version": "20.17.9", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.9.tgz", - "integrity": "sha512-0JOXkRyLanfGPE2QRCwgxhzlBAvaRdCNMcvbd7jFfpmD4eEXll7LRwy5ymJmyeZqk7Nh7eD2LeUyQ68BbndmXw==", - "dev": true, - "license": "MIT", - "dependencies": { - "undici-types": "~6.19.2" - } - }, - "node_modules/@wdio/repl/node_modules/undici-types": { - "version": "6.19.8", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz", - "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==", - "dev": true, - "license": "MIT" - }, "node_modules/@wdio/types": { "version": "8.16.12", "resolved": "https://registry.npmjs.org/@wdio/types/-/types-8.16.12.tgz", @@ -15232,23 +15285,6 @@ "node": "^16.13 || >=18" } }, - "node_modules/@wdio/types/node_modules/@types/node": { - "version": "20.17.9", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.9.tgz", - "integrity": "sha512-0JOXkRyLanfGPE2QRCwgxhzlBAvaRdCNMcvbd7jFfpmD4eEXll7LRwy5ymJmyeZqk7Nh7eD2LeUyQ68BbndmXw==", - "dev": true, - "license": "MIT", - "dependencies": { - "undici-types": "~6.19.2" - } - }, - "node_modules/@wdio/types/node_modules/undici-types": { - "version": "6.19.8", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz", - "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==", - "dev": true, - "license": "MIT" - }, "node_modules/@wdio/utils": { "version": "8.16.17", "resolved": "https://registry.npmjs.org/@wdio/utils/-/utils-8.16.17.tgz", @@ -45301,9 +45337,10 @@ } }, "node_modules/undici-types": { - "version": "6.20.0", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", - "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==" + "version": "6.19.8", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz", + "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==", + "license": "MIT" }, "node_modules/unherit": { "version": "1.1.1", @@ -46455,16 +46492,6 @@ "node": ">=14.16" } }, - "node_modules/webdriver/node_modules/@types/node": { - "version": "20.17.9", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.9.tgz", - "integrity": "sha512-0JOXkRyLanfGPE2QRCwgxhzlBAvaRdCNMcvbd7jFfpmD4eEXll7LRwy5ymJmyeZqk7Nh7eD2LeUyQ68BbndmXw==", - "dev": true, - "license": "MIT", - "dependencies": { - "undici-types": "~6.19.2" - } - }, "node_modules/webdriver/node_modules/cacheable-lookup": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/cacheable-lookup/-/cacheable-lookup-7.0.0.tgz", @@ -46625,13 +46652,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/webdriver/node_modules/undici-types": { - "version": "6.19.8", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz", - "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==", - "dev": true, - "license": "MIT" - }, "node_modules/webdriver/node_modules/ws": { "version": "8.18.0", "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz", @@ -46728,16 +46748,6 @@ } } }, - "node_modules/webdriverio/node_modules/@types/node": { - "version": "20.17.9", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.9.tgz", - "integrity": "sha512-0JOXkRyLanfGPE2QRCwgxhzlBAvaRdCNMcvbd7jFfpmD4eEXll7LRwy5ymJmyeZqk7Nh7eD2LeUyQ68BbndmXw==", - "dev": true, - "license": "MIT", - "dependencies": { - "undici-types": "~6.19.2" - } - }, "node_modules/webdriverio/node_modules/aria-query": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz", @@ -46985,13 +46995,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/webdriverio/node_modules/undici-types": { - "version": "6.19.8", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz", - "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==", - "dev": true, - "license": "MIT" - }, "node_modules/webdriverio/node_modules/wrap-ansi": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz", diff --git a/package.json b/package.json index f785a2c6385aca..21b15a5fcc9ced 100644 --- a/package.json +++ b/package.json @@ -65,6 +65,7 @@ "@types/estree": "1.0.5", "@types/istanbul-lib-report": "3.0.0", "@types/mime": "2.0.3", + "@types/node": "20.17.10", "@types/npm-package-arg": "6.1.1", "@types/prettier": "2.4.4", "@types/qs": "6.9.7", diff --git a/test/e2e/playwright.config.ts b/test/e2e/playwright.config.ts index f5410f2230372b..bb93f342f9bf8c 100644 --- a/test/e2e/playwright.config.ts +++ b/test/e2e/playwright.config.ts @@ -8,7 +8,7 @@ import { defineConfig, devices } from '@playwright/test'; /** * WordPress dependencies */ -const baseConfig = require( '@wordpress/scripts/config/playwright.config' ); +import baseConfig from '@wordpress/scripts/config/playwright.config.js'; const config = defineConfig( { ...baseConfig, diff --git a/test/e2e/specs/interactivity/fixtures/index.ts b/test/e2e/specs/interactivity/fixtures/index.ts index 607221ffb1ec43..08a72d20ef5ff7 100644 --- a/test/e2e/specs/interactivity/fixtures/index.ts +++ b/test/e2e/specs/interactivity/fixtures/index.ts @@ -18,8 +18,8 @@ export const test = base.extend< Fixtures >( { async ( { requestUtils }, use ) => { await use( new InteractivityUtils( { requestUtils } ) ); }, - // @ts-ignore: The required type is 'test', but can be 'worker' too. See + // This is a hack, 'worker' is a valid value but the type is wrong. // https://playwright.dev/docs/test-fixtures#worker-scoped-fixtures - { scope: 'worker' }, + { scope: 'worker' as 'test' }, ], } ); diff --git a/test/e2e/tsconfig.json b/test/e2e/tsconfig.json index 28d349fc19bef7..080d514f6f3634 100644 --- a/test/e2e/tsconfig.json +++ b/test/e2e/tsconfig.json @@ -2,11 +2,11 @@ "$schema": "https://json.schemastore.org/tsconfig.json", "extends": "../../tsconfig.base.json", "compilerOptions": { + "checkJs": false, "noEmit": true, - "emitDeclarationOnly": false, - "allowJs": true, - "checkJs": false + "rootDir": ".", + "types": [ "node" ] }, - "include": [ "**/*" ], + "include": [ "." ], "exclude": [] } diff --git a/test/performance/playwright.config.ts b/test/performance/playwright.config.ts index fafca3a589122f..75e87c4d2d0f00 100644 --- a/test/performance/playwright.config.ts +++ b/test/performance/playwright.config.ts @@ -8,7 +8,7 @@ import { defineConfig } from '@playwright/test'; /** * WordPress dependencies */ -const baseConfig = require( '@wordpress/scripts/config/playwright.config' ); +import baseConfig from '@wordpress/scripts/config/playwright.config.js'; process.env.ASSETS_PATH = path.join( __dirname, 'assets' ); diff --git a/test/performance/tsconfig.json b/test/performance/tsconfig.json index 28d349fc19bef7..080d514f6f3634 100644 --- a/test/performance/tsconfig.json +++ b/test/performance/tsconfig.json @@ -2,11 +2,11 @@ "$schema": "https://json.schemastore.org/tsconfig.json", "extends": "../../tsconfig.base.json", "compilerOptions": { + "checkJs": false, "noEmit": true, - "emitDeclarationOnly": false, - "allowJs": true, - "checkJs": false + "rootDir": ".", + "types": [ "node" ] }, - "include": [ "**/*" ], + "include": [ "." ], "exclude": [] } diff --git a/tsconfig.json b/tsconfig.json index 93d0bd976dd005..55759b5015bfd2 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -59,7 +59,9 @@ { "path": "packages/url" }, { "path": "packages/vips" }, { "path": "packages/warning" }, - { "path": "packages/wordcount" } + { "path": "packages/wordcount" }, + { "path": "test/e2e" }, + { "path": "test/performance" } ], "files": [] } From 1ba8152f09f6ffc30699145705ada748cf5e917e Mon Sep 17 00:00:00 2001 From: Lena Morita Date: Fri, 27 Dec 2024 22:33:37 +0900 Subject: [PATCH 7/7] DocumentTools: Use standard ToolbarButton for inserter (#68332) Co-authored-by: mirka <0mirka00@git.wordpress.org> Co-authored-by: tyxla --- packages/editor/src/components/document-tools/index.js | 9 +++------ packages/editor/src/components/document-tools/style.scss | 6 ------ 2 files changed, 3 insertions(+), 12 deletions(-) diff --git a/packages/editor/src/components/document-tools/index.js b/packages/editor/src/components/document-tools/index.js index a98def685e93a6..71a8b1b094a135 100644 --- a/packages/editor/src/components/document-tools/index.js +++ b/packages/editor/src/components/document-tools/index.js @@ -10,7 +10,7 @@ import { useViewportMatch } from '@wordpress/compose'; import { useSelect, useDispatch } from '@wordpress/data'; import { __, _x } from '@wordpress/i18n'; import { NavigableToolbar, ToolSelector } from '@wordpress/block-editor'; -import { Button, ToolbarItem } from '@wordpress/components'; +import { ToolbarButton, ToolbarItem } from '@wordpress/components'; import { listView, plus } from '@wordpress/icons'; import { useCallback } from '@wordpress/element'; import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts'; @@ -118,9 +118,8 @@ function DocumentTools( { className, disableBlockTools = false } ) { >
{ ! isDistractionFree && ( - { ! isDistractionFree && ( - ) } diff --git a/packages/editor/src/components/document-tools/style.scss b/packages/editor/src/components/document-tools/style.scss index a1abfd5abd7aef..dfafff2126d66d 100644 --- a/packages/editor/src/components/document-tools/style.scss +++ b/packages/editor/src/components/document-tools/style.scss @@ -74,14 +74,8 @@ } .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle.has-icon { - min-width: $button-size-compact; - width: $button-size-compact; - height: $button-size-compact; - padding: 0; - .show-icon-labels & { width: auto; - height: $button-size-compact; padding: 0 $grid-unit-10; } }