From 0b6f3c2711d91b3e28ea8b7642cf9c49e2f694e1 Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Fri, 1 Sep 2023 16:57:17 +0300 Subject: [PATCH 1/2] feat: add new tab option for button link --- inc/render/class-review-block.php | 2 +- src/blocks/blocks/review/block.json | 6 ++++-- src/blocks/blocks/review/inspector.js | 12 ++++++++++++ 3 files changed, 17 insertions(+), 3 deletions(-) diff --git a/inc/render/class-review-block.php b/inc/render/class-review-block.php index b12b07ce2..975e5a783 100644 --- a/inc/render/class-review-block.php +++ b/inc/render/class-review-block.php @@ -193,7 +193,7 @@ function() use ( $attributes, $post_id ) { foreach ( $attributes['links'] as $link ) { $rel = ( isset( $link['isSponsored'] ) && true === $link['isSponsored'] ) ? 'sponsored' : 'nofollow'; - $html .= ' ' . esc_html( $link['label'] ) . ''; + $html .= ' ' . esc_html( $link['label'] ) . ''; } $html .= ' '; $html .= ' '; diff --git a/src/blocks/blocks/review/block.json b/src/blocks/blocks/review/block.json index 5c1935128..63eb49cea 100644 --- a/src/blocks/blocks/review/block.json +++ b/src/blocks/blocks/review/block.json @@ -73,12 +73,14 @@ { "label": "Buy on Amazon", "href": "", - "isSponsored": false + "isSponsored": false, + "target": "_blank" }, { "label": "Buy on eBay", "href": "", - "isSponsored": false + "isSponsored": false, + "target": "_blank" } ] }, diff --git a/src/blocks/blocks/review/inspector.js b/src/blocks/blocks/review/inspector.js index 6ce9e5350..25c463112 100644 --- a/src/blocks/blocks/review/inspector.js +++ b/src/blocks/blocks/review/inspector.js @@ -598,6 +598,12 @@ const Inspector = ({ checked={ link.isSponsored } disabled={ attributes.product } /> + + ) ) } @@ -630,6 +636,12 @@ const Inspector = ({ checked={ link.isSponsored } onChange={ () => onChangeLink({ action: 'update', index, value: { isSponsored: ! link.isSponsored }}) } /> + + onChangeLink({ action: 'update', index, value: { target: '_blank' === link.target ? '_self' : '_blank' }}) } + /> ) ) } From 1664bc19f8ca3f7c710f3b88a62dbab423a63e6d Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Fri, 1 Sep 2023 17:28:10 +0300 Subject: [PATCH 2/2] chore: e2e test & default behaviour --- inc/render/class-review-block.php | 2 +- src/blocks/blocks/review/block.json | 24 +++++++++---------- src/blocks/blocks/review/inspector.js | 4 ++-- .../test/e2e/blocks/product-review.spec.js | 21 ++++++++++++++++ 4 files changed, 36 insertions(+), 15 deletions(-) diff --git a/inc/render/class-review-block.php b/inc/render/class-review-block.php index 975e5a783..f682983e7 100644 --- a/inc/render/class-review-block.php +++ b/inc/render/class-review-block.php @@ -193,7 +193,7 @@ function() use ( $attributes, $post_id ) { foreach ( $attributes['links'] as $link ) { $rel = ( isset( $link['isSponsored'] ) && true === $link['isSponsored'] ) ? 'sponsored' : 'nofollow'; - $html .= ' ' . esc_html( $link['label'] ) . ''; + $html .= ' ' . esc_html( $link['label'] ) . ''; } $html .= ' '; $html .= ' '; diff --git a/src/blocks/blocks/review/block.json b/src/blocks/blocks/review/block.json index 63eb49cea..653b7c894 100644 --- a/src/blocks/blocks/review/block.json +++ b/src/blocks/blocks/review/block.json @@ -70,18 +70,18 @@ "links": { "type": "array", "default": [ - { - "label": "Buy on Amazon", - "href": "", - "isSponsored": false, - "target": "_blank" - }, - { - "label": "Buy on eBay", - "href": "", - "isSponsored": false, - "target": "_blank" - } + { + "label": "Buy on Amazon", + "href": "", + "isSponsored": false, + "target": "_blank" + }, + { + "label": "Buy on eBay", + "href": "", + "isSponsored": false, + "target": "_blank" + } ] }, "prosLabel": { diff --git a/src/blocks/blocks/review/inspector.js b/src/blocks/blocks/review/inspector.js index 25c463112..c91a00753 100644 --- a/src/blocks/blocks/review/inspector.js +++ b/src/blocks/blocks/review/inspector.js @@ -639,8 +639,8 @@ const Inspector = ({ onChangeLink({ action: 'update', index, value: { target: '_blank' === link.target ? '_self' : '_blank' }}) } + checked={ undefined === link.target || '_blank' === link.target } + onChange={ () => onChangeLink({ action: 'update', index, value: { target: '_blank' === link.target || undefined === link.target ? '_self' : '_blank' }}) } /> ) ) } diff --git a/src/blocks/test/e2e/blocks/product-review.spec.js b/src/blocks/test/e2e/blocks/product-review.spec.js index bf98655df..83257b186 100644 --- a/src/blocks/test/e2e/blocks/product-review.spec.js +++ b/src/blocks/test/e2e/blocks/product-review.spec.js @@ -81,5 +81,26 @@ test.describe( 'Product Review Block', () => { await expect( await page.getByRole( 'document', { name: 'Block: Product Review' }).getByText( FEATURE_DESCRIPTION, { exact: true }) ).toBeVisible(); }); + test( 'open in new tab', async({ editor, page }) => { + await editor.insertBlock({ name: 'themeisle-blocks/review' }); + + await page.getByRole( 'button', { name: 'Buttons' }).click({ clickCount: 1 }); + + await page.getByRole( 'button', { name: 'Add Links' }).click(); + + await page.getByRole( 'button', { name: 'Buy Now' }).click(); + + await page.getByPlaceholder( 'Button label' ).fill( 'Buy Now in same tab' ); + await page.getByLabel( 'Open in New Tab' ).click(); + await page.getByRole( 'button', { name: 'Add Links' }).click(); + + const postId = await editor.publishPost(); + + await page.goto( `/?p=${postId}` ); + + await expect( page.getByRole( 'link', { name: 'Buy Now in same tab' }) ).toHaveAttribute( 'target', '_self' ); + await expect( page.getByRole( 'link', { name: 'Buy Now', exact: true }) ).toHaveAttribute( 'target', '_blank' ); + + }); });