diff --git a/packages/block-library/src/embed/test/__snapshots__/index.native.js.snap b/packages/block-library/src/embed/test/__snapshots__/index.native.js.snap index 5f1889dfa4aaf7..2979ef0324592f 100644 --- a/packages/block-library/src/embed/test/__snapshots__/index.native.js.snap +++ b/packages/block-library/src/embed/test/__snapshots__/index.native.js.snap @@ -106,21 +106,21 @@ exports[`Embed block edit URL sets empty state when setting an empty URL 1`] = ` exports[`Embed block insert via slash inserter insert generic embed block 1`] = `""`; -exports[`Embed block insert via slash inserter inserts Twitter embed block 1`] = `""`; +exports[`Embed block insert via slash inserter inserts Twitter Embed block 1`] = `""`; -exports[`Embed block insert via slash inserter inserts Vimeo embed block 1`] = `""`; +exports[`Embed block insert via slash inserter inserts Vimeo Embed block 1`] = `""`; -exports[`Embed block insert via slash inserter inserts WordPress embed block 1`] = `""`; +exports[`Embed block insert via slash inserter inserts WordPress Embed block 1`] = `""`; -exports[`Embed block insert via slash inserter inserts YouTube embed block 1`] = `""`; +exports[`Embed block insert via slash inserter inserts YouTube Embed block 1`] = `""`; -exports[`Embed block insertion inserts Twitter embed block 1`] = `""`; +exports[`Embed block insertion inserts Twitter Embed block 1`] = `""`; -exports[`Embed block insertion inserts Vimeo embed block 1`] = `""`; +exports[`Embed block insertion inserts Vimeo Embed block 1`] = `""`; -exports[`Embed block insertion inserts WordPress embed block 1`] = `""`; +exports[`Embed block insertion inserts WordPress Embed block 1`] = `""`; -exports[`Embed block insertion inserts YouTube embed block 1`] = `""`; +exports[`Embed block insertion inserts YouTube Embed block 1`] = `""`; exports[`Embed block insertion inserts generic embed block 1`] = `""`; diff --git a/packages/block-library/src/embed/test/index.js b/packages/block-library/src/embed/test/index.js index 1ae85105ad7c3b..7cc3645611ea78 100644 --- a/packages/block-library/src/embed/test/index.js +++ b/packages/block-library/src/embed/test/index.js @@ -200,7 +200,7 @@ describe( 'utils', () => { expect( getEmbedInfoByProvider( 'instagram' ) ).toEqual( expect.objectContaining( { icon: embedInstagramIcon, - title: 'Instagram', + title: 'Instagram Embed', } ) ); } ); diff --git a/packages/block-library/src/embed/test/index.native.js b/packages/block-library/src/embed/test/index.native.js index 1b456c668a9c52..59e4cfe51fccec 100644 --- a/packages/block-library/src/embed/test/index.native.js +++ b/packages/block-library/src/embed/test/index.native.js @@ -230,7 +230,7 @@ describe( 'Embed block', () => { } ); MOST_USED_PROVIDERS.forEach( ( { title } ) => - it( `inserts ${ title } embed block`, async () => { + it( `inserts ${ title } block`, async () => { const { block } = await insertEmbedBlock( title ); const blockName = within( block ).getByText( title ); @@ -285,10 +285,10 @@ describe( 'Embed block', () => { const blockSettingsModal = await editor.findByTestId( 'block-settings-modal' ); - // Get Twitter link field. + // Get Twitter Embed link field. const twitterLinkField = within( blockSettingsModal - ).getByLabelText( `Twitter link, ${ expectedURL }` ); + ).getByLabelText( `Twitter Embed link, ${ expectedURL }` ); expect( twitterLinkField ).toBeDefined(); expect( getEditorHtml() ).toMatchSnapshot(); @@ -321,10 +321,10 @@ describe( 'Embed block', () => { const blockSettingsModal = await editor.findByTestId( 'block-settings-modal' ); - // Get Twitter link field. + // Get Twitter Embed link field. const twitterLinkField = within( blockSettingsModal - ).getByLabelText( `Twitter link, ${ clipboardURL }` ); + ).getByLabelText( `Twitter Embed link, ${ clipboardURL }` ); expect( autopastedLinkField ).toBeDefined(); expect( twitterLinkField ).toBeDefined(); @@ -383,10 +383,10 @@ describe( 'Embed block', () => { const blockSettingsModal = await editor.findByTestId( 'block-settings-modal' ); - // Get Twitter link field. + // Get Twitter Embed link field. const twitterLinkField = within( blockSettingsModal - ).getByLabelText( `Twitter link, ${ expectedURL }` ); + ).getByLabelText( `Twitter Embed link, ${ expectedURL }` ); expect( twitterLinkField ).toBeDefined(); expect( getEditorHtml() ).toMatchSnapshot(); @@ -422,10 +422,10 @@ describe( 'Embed block', () => { const blockSettingsModal = await editor.findByTestId( 'block-settings-modal' ); - // Get Twitter link field. + // Get Twitter Embed link field. const twitterLinkField = within( blockSettingsModal - ).getByLabelText( `Twitter link, ${ clipboardURL }` ); + ).getByLabelText( `Twitter Embed link, ${ clipboardURL }` ); expect( embedLink ).toBeDefined(); expect( twitterLinkField ).toBeDefined(); @@ -472,10 +472,10 @@ describe( 'Embed block', () => { ); await waitForModalVisible( blockSettingsModal ); - // Start editing link. + // Start editing Embed link. fireEvent.press( within( blockSettingsModal ).getByLabelText( - `Twitter link, ${ initialURL }` + `Twitter Embed link, ${ initialURL }` ) ); @@ -491,10 +491,10 @@ describe( 'Embed block', () => { await waitFor( () => editor.UNSAFE_getByType( WebView ) ); await editor.findByText( 'Media settings' ); - // Get YouTube link field. + // Get YouTube Embed link field. const youtubeLinkField = await within( blockSettingsModal - ).findByLabelText( `YouTube link, ${ expectedURL }` ); + ).findByLabelText( `YouTube Embed link, ${ expectedURL }` ); expect( youtubeLinkField ).toBeDefined(); expect( getEditorHtml() ).toMatchSnapshot(); @@ -519,7 +519,7 @@ describe( 'Embed block', () => { // Start editing link. fireEvent.press( within( blockSettingsModal ).getByLabelText( - `Twitter link, ${ previousURL }` + `Twitter Embed link, ${ previousURL }` ) ); @@ -557,7 +557,7 @@ describe( 'Embed block', () => { // Start editing link. fireEvent.press( within( blockSettingsModal ).getByLabelText( - `Twitter link, ${ previousURL }` + `Twitter Embed link, ${ previousURL }` ) ); @@ -661,10 +661,10 @@ describe( 'Embed block', () => { fireEvent( blockSettingsModal, 'backdropPress' ); fireEvent( blockSettingsModal, MODAL_DISMISS_EVENT ); - // Get Twitter link field. + // Get Twitter Embed link field. const twitterLinkField = await within( blockSettingsModal - ).findByLabelText( `Twitter link, ${ expectedURL }` ); + ).findByLabelText( `Twitter Embed link, ${ expectedURL }` ); expect( twitterLinkField ).toBeDefined(); expect( getEditorHtml() ).toMatchSnapshot(); @@ -728,10 +728,10 @@ describe( 'Embed block', () => { const blockSettingsModal = await editor.findByTestId( 'block-settings-modal' ); - // Get Twitter link field. + // Get Twitter Embed link field. const twitterLinkField = within( blockSettingsModal - ).getByLabelText( `Twitter link, ${ expectedURL }` ); + ).getByLabelText( `Twitter Embed link, ${ expectedURL }` ); expect( twitterLinkField ).toBeDefined(); expect( getEditorHtml() ).toMatchSnapshot(); @@ -811,10 +811,10 @@ describe( 'Embed block', () => { const blockSettingsModal = await editor.findByTestId( 'block-settings-modal' ); - // Get Twitter link field. + // Get Twitter embed link field. const twitterLinkField = within( blockSettingsModal - ).getByLabelText( `Twitter link, ${ successURL }` ); + ).getByLabelText( `Twitter Embed link, ${ successURL }` ); expect( twitterLinkField ).toBeDefined(); expect( getEditorHtml() ).toMatchSnapshot(); @@ -1000,8 +1000,9 @@ describe( 'Embed block', () => { } ); MOST_USED_PROVIDERS.forEach( ( { title } ) => - it( `inserts ${ title } embed block`, async () => { - const embedBlockSlashInserter = `/${ title }`; + it( `inserts ${ title } block`, async () => { + // Get just the first word of the title ("Twitter") as the full title ("Twitter Embed") breaks the test. + const embedBlockSlashInserter = `/${ title.split( ' ' )[ 0 ] }`; const editor = await initializeEditor( { initialHtml: EMPTY_PARAGRAPH_HTML, } ); diff --git a/packages/block-library/src/embed/variations.js b/packages/block-library/src/embed/variations.js index 6e1813f94210ec..82a4159e13b327 100644 --- a/packages/block-library/src/embed/variations.js +++ b/packages/block-library/src/embed/variations.js @@ -1,7 +1,7 @@ /** * WordPress dependencies */ -import { __ } from '@wordpress/i18n'; +import { __, sprintf } from '@wordpress/i18n'; /** * Internal dependencies @@ -32,6 +32,14 @@ import { /** @typedef {import('@wordpress/blocks').WPBlockVariation} WPBlockVariation */ +function getTitle( providerName ) { + return sprintf( + /* translators: %s: provider name */ + __( '%s Embed' ), + providerName + ); +} + /** * The embed provider services. * @@ -40,7 +48,7 @@ import { const variations = [ { name: 'twitter', - title: 'Twitter', + title: getTitle( 'Twitter' ), icon: embedTwitterIcon, keywords: [ 'tweet', __( 'social' ) ], description: __( 'Embed a tweet.' ), @@ -49,7 +57,7 @@ const variations = [ }, { name: 'youtube', - title: 'YouTube', + title: getTitle( 'YouTube' ), icon: embedYouTubeIcon, keywords: [ __( 'music' ), __( 'video' ) ], description: __( 'Embed a YouTube video.' ), @@ -63,7 +71,7 @@ const variations = [ // Deprecate Facebook Embed per FB policy // See: https://developers.facebook.com/docs/plugins/oembed-legacy name: 'facebook', - title: 'Facebook', + title: getTitle( 'Facebook' ), icon: embedFacebookIcon, keywords: [ __( 'social' ) ], description: __( 'Embed a Facebook post.' ), @@ -79,7 +87,7 @@ const variations = [ // Deprecate Instagram per FB policy // See: https://developers.facebook.com/docs/instagram/oembed-legacy name: 'instagram', - title: 'Instagram', + title: getTitle( 'Instagram' ), icon: embedInstagramIcon, keywords: [ __( 'image' ), __( 'social' ) ], description: __( 'Embed an Instagram post.' ), @@ -89,7 +97,7 @@ const variations = [ }, { name: 'wordpress', - title: 'WordPress', + title: getTitle( 'WordPress' ), icon: embedWordPressIcon, keywords: [ __( 'post' ), __( 'blog' ) ], description: __( 'Embed a WordPress post.' ), @@ -99,7 +107,7 @@ const variations = [ }, { name: 'soundcloud', - title: 'SoundCloud', + title: getTitle( 'SoundCloud' ), icon: embedAudioIcon, keywords: [ __( 'music' ), __( 'audio' ) ], description: __( 'Embed SoundCloud content.' ), @@ -108,7 +116,7 @@ const variations = [ }, { name: 'spotify', - title: 'Spotify', + title: getTitle( 'Spotify' ), icon: embedSpotifyIcon, keywords: [ __( 'music' ), __( 'audio' ) ], description: __( 'Embed Spotify content.' ), @@ -117,7 +125,7 @@ const variations = [ }, { name: 'flickr', - title: 'Flickr', + title: getTitle( 'Flickr' ), icon: embedFlickrIcon, keywords: [ __( 'image' ) ], description: __( 'Embed Flickr content.' ), @@ -129,7 +137,7 @@ const variations = [ }, { name: 'vimeo', - title: 'Vimeo', + title: getTitle( 'Vimeo' ), icon: embedVimeoIcon, keywords: [ __( 'video' ) ], description: __( 'Embed a Vimeo video.' ), @@ -138,7 +146,7 @@ const variations = [ }, { name: 'animoto', - title: 'Animoto', + title: getTitle( 'Animoto' ), icon: embedAnimotoIcon, description: __( 'Embed an Animoto video.' ), patterns: [ /^https?:\/\/(www\.)?(animoto|video214)\.com\/.+/i ], @@ -146,7 +154,7 @@ const variations = [ }, { name: 'cloudup', - title: 'Cloudup', + title: getTitle( 'Cloudup' ), icon: embedContentIcon, description: __( 'Embed Cloudup content.' ), patterns: [ /^https?:\/\/cloudup\.com\/.+/i ], @@ -155,7 +163,7 @@ const variations = [ { // Deprecated since CollegeHumor content is now powered by YouTube. name: 'collegehumor', - title: 'CollegeHumor', + title: getTitle( 'CollegeHumor' ), icon: embedVideoIcon, description: __( 'Embed CollegeHumor content.' ), scope: [ 'block' ], @@ -164,7 +172,7 @@ const variations = [ }, { name: 'crowdsignal', - title: 'Crowdsignal', + title: getTitle( 'Crowdsignal' ), icon: embedContentIcon, keywords: [ 'polldaddy', __( 'survey' ) ], description: __( 'Embed Crowdsignal (formerly Polldaddy) content.' ), @@ -175,7 +183,7 @@ const variations = [ }, { name: 'dailymotion', - title: 'Dailymotion', + title: getTitle( 'Dailymotion' ), icon: embedDailymotionIcon, keywords: [ __( 'video' ) ], description: __( 'Embed a Dailymotion video.' ), @@ -184,7 +192,7 @@ const variations = [ }, { name: 'imgur', - title: 'Imgur', + title: getTitle( 'Imgur' ), icon: embedPhotoIcon, description: __( 'Embed Imgur content.' ), patterns: [ /^https?:\/\/(.+\.)?imgur\.com\/.+/i ], @@ -192,7 +200,7 @@ const variations = [ }, { name: 'issuu', - title: 'Issuu', + title: getTitle( 'Issuu' ), icon: embedContentIcon, description: __( 'Embed Issuu content.' ), patterns: [ /^https?:\/\/(www\.)?issuu\.com\/.+/i ], @@ -200,7 +208,7 @@ const variations = [ }, { name: 'kickstarter', - title: 'Kickstarter', + title: getTitle( 'Kickstarter' ), icon: embedContentIcon, description: __( 'Embed Kickstarter content.' ), patterns: [ @@ -211,7 +219,7 @@ const variations = [ }, { name: 'mixcloud', - title: 'Mixcloud', + title: getTitle( 'Mixcloud' ), icon: embedAudioIcon, keywords: [ __( 'music' ), __( 'audio' ) ], description: __( 'Embed Mixcloud content.' ), @@ -220,7 +228,7 @@ const variations = [ }, { name: 'pocket-casts', - title: 'Pocket Casts', + title: getTitle( 'Pocket Casts' ), icon: embedPocketCastsIcon, keywords: [ __( 'podcast' ), __( 'audio' ) ], description: __( 'Embed a podcast player from Pocket Casts.' ), @@ -229,7 +237,7 @@ const variations = [ }, { name: 'reddit', - title: 'Reddit', + title: getTitle( 'Reddit' ), icon: embedRedditIcon, description: __( 'Embed a Reddit thread.' ), patterns: [ /^https?:\/\/(www\.)?reddit\.com\/.+/i ], @@ -237,7 +245,7 @@ const variations = [ }, { name: 'reverbnation', - title: 'ReverbNation', + title: getTitle( 'ReverbNation' ), icon: embedAudioIcon, description: __( 'Embed ReverbNation content.' ), patterns: [ /^https?:\/\/(www\.)?reverbnation\.com\/.+/i ], @@ -245,7 +253,7 @@ const variations = [ }, { name: 'screencast', - title: 'Screencast', + title: getTitle( 'Screencast' ), icon: embedVideoIcon, description: __( 'Embed Screencast content.' ), patterns: [ /^https?:\/\/(www\.)?screencast\.com\/.+/i ], @@ -253,7 +261,7 @@ const variations = [ }, { name: 'scribd', - title: 'Scribd', + title: getTitle( 'Scribd' ), icon: embedContentIcon, description: __( 'Embed Scribd content.' ), patterns: [ /^https?:\/\/(www\.)?scribd\.com\/.+/i ], @@ -261,7 +269,7 @@ const variations = [ }, { name: 'smugmug', - title: 'SmugMug', + title: getTitle( 'SmugMug' ), icon: embedPhotoIcon, description: __( 'Embed SmugMug content.' ), patterns: [ /^https?:\/\/(.+\.)?smugmug\.com\/.*/i ], @@ -273,7 +281,7 @@ const variations = [ }, { name: 'speaker-deck', - title: 'Speaker Deck', + title: getTitle( 'Speaker Deck' ), icon: embedContentIcon, description: __( 'Embed Speaker Deck content.' ), patterns: [ /^https?:\/\/(www\.)?speakerdeck\.com\/.+/i ], @@ -281,7 +289,7 @@ const variations = [ }, { name: 'tiktok', - title: 'TikTok', + title: getTitle( 'TikTok' ), icon: embedVideoIcon, keywords: [ __( 'video' ) ], description: __( 'Embed a TikTok video.' ), @@ -290,7 +298,7 @@ const variations = [ }, { name: 'ted', - title: 'TED', + title: getTitle( 'TED' ), icon: embedVideoIcon, description: __( 'Embed a TED video.' ), patterns: [ /^https?:\/\/(www\.|embed\.)?ted\.com\/.+/i ], @@ -298,7 +306,7 @@ const variations = [ }, { name: 'tumblr', - title: 'Tumblr', + title: getTitle( 'Tumblr' ), icon: embedTumblrIcon, keywords: [ __( 'social' ) ], description: __( 'Embed a Tumblr post.' ), @@ -307,7 +315,7 @@ const variations = [ }, { name: 'videopress', - title: 'VideoPress', + title: getTitle( 'VideoPress' ), icon: embedVideoIcon, keywords: [ __( 'video' ) ], description: __( 'Embed a VideoPress video.' ), @@ -316,7 +324,7 @@ const variations = [ }, { name: 'wordpress-tv', - title: 'WordPress.tv', + title: getTitle( 'WordPress.tv' ), icon: embedVideoIcon, description: __( 'Embed a WordPress.tv video.' ), patterns: [ /^https?:\/\/wordpress\.tv\/.+/i ], @@ -324,7 +332,7 @@ const variations = [ }, { name: 'amazon-kindle', - title: 'Amazon Kindle', + title: getTitle( 'Amazon Kindle' ), icon: embedAmazonIcon, keywords: [ __( 'ebook' ) ], description: __( 'Embed Amazon Kindle content.' ), @@ -336,7 +344,7 @@ const variations = [ }, { name: 'pinterest', - title: 'Pinterest', + title: getTitle( 'Pinterest' ), icon: embedPinterestIcon, keywords: [ __( 'social' ), __( 'bookmark' ) ], description: __( 'Embed Pinterest pins, boards, and profiles.' ), @@ -347,7 +355,7 @@ const variations = [ }, { name: 'wolfram-cloud', - title: 'Wolfram', + title: getTitle( 'Wolfram' ), icon: embedWolframIcon, description: __( 'Embed Wolfram notebook content.' ), patterns: [ /^https?:\/\/(www\.)?wolframcloud\.com\/obj\/.+/i ], @@ -355,7 +363,7 @@ const variations = [ }, { name: 'bluesky', - title: 'Bluesky', + title: getTitle( 'Bluesky' ), icon: embedBlueskyIcon, description: __( 'Embed a Bluesky post.' ), patterns: [ /^https?:\/\/bsky\.app\/profile\/.+\/post\/.+/i ],