Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix : Empty last List Element should not be displayed #66344

Closed
wants to merge 16 commits into from
+25 −47
Closed

Fix : Empty last List Element should not be displayed #66344

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
3b5ea15
Add check for empty list item
nani-samireddy Oct 22, 2024
2b3a6fc
Update the chek with RichText.isEmpty
nani-samireddy Oct 23, 2024
fb16d8a
Update: test case according to the structural change of the list-item…
nani-samireddy Dec 13, 2024
226daa9
Fix: e2e test
up1512001 Dec 13, 2024
032a1ab
Fix: mobile unit test
up1512001 Dec 13, 2024
b88a206
Fix: list test snapshots
up1512001 Dec 13, 2024
8d39b07
Fix: list edit.native test
up1512001 Dec 13, 2024
572f810
Fix: para snapshot
up1512001 Dec 13, 2024
df603c3
Fix: para snapshot ul & ol alignment
up1512001 Dec 13, 2024
0444699
Merge branch 'WordPress:trunk' into enhancement/fix-empty-last-list-item
nani-samireddy Dec 13, 2024
7cdac76
Fix: list test snapshots ul alignment
up1512001 Dec 13, 2024
b135dac
Fix: list.spec test
up1512001 Dec 13, 2024
3b30024
Merge branch 'WordPress:trunk' into enhancement/fix-empty-last-list-item
nani-samireddy Dec 17, 2024
6abe881
Update 2e2 test cases
nani-samireddy Dec 17, 2024
49a3de7
fix: update list e2e test cases
nani-samireddy Dec 17, 2024
b0b5bd9
Merge branch 'WordPress:trunk' into enhancement/fix-empty-last-list-item
nani-samireddy Dec 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions packages/block-library/src/list-item/save.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,14 @@
import { InnerBlocks, RichText, useBlockProps } from '@wordpress/block-editor';

export default function save( { attributes } ) {
/**
* Render the list item only if there is content.
* This check is to eliminate empty list items from the front end.
*/
if ( RichText.isEmpty( attributes.content ) ) {
return null;
}

return (
<li { ...useBlockProps.save() }>
<RichText.Content value={ attributes.content } />
Expand Down
4 changes: 1 addition & 3 deletions packages/block-library/src/list/test/__snapshots__/edit.native.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,9 +54,7 @@ exports[`List block changes to reverse ordered list 1`] = `

exports[`List block inserts block 1`] = `
"<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /--></ul>
<!-- /wp:list -->"
`;

Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/list/test/edit.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,8 +60,8 @@ describe( 'List block', () => {

it( 'adds one item to the list', async () => {
const initialHtml = `<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li><!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /-->
</ul>
<!-- /wp:list -->`;

const screen = await initializeEditor( {
Expand Down
8 changes: 2 additions & 6 deletions packages/block-library/src/paragraph/test/__snapshots__/edit.native.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,7 @@ exports[`Paragraph block should be able to use a prefix to create a Heading bloc

exports[`Paragraph block should be able to use a prefix to create a List block 1`] = `
"<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /--></ul>
<!-- /wp:list -->"
`;

Expand All @@ -24,9 +22,7 @@ exports[`Paragraph block should be able to use a prefix to create a Quote block

exports[`Paragraph block should be able to use a prefix to create a numbered List block 1`] = `
"<!-- wp:list {"ordered":true} -->
<ol class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ol>
<ol class="wp-block-list"><!-- wp:list-item /--></ol>
<!-- /wp:list -->"
`;

Expand Down
40 changes: 10 additions & 30 deletions test/e2e/specs/editor/blocks/list.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -502,9 +502,7 @@ test.describe( 'List (@firefox)', () => {
<li>one</li>
<!-- /wp:list-item -->
<!-- wp:list-item -->
<li></li>
<!-- /wp:list-item -->
<!-- wp:list-item /-->
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This does not make any sense to me.

<!-- wp:list-item -->
<li>two</li>
Expand Down Expand Up @@ -545,9 +543,7 @@ test.describe( 'List (@firefox)', () => {
<li>one</li>
<!-- /wp:list-item -->
<!-- wp:list-item -->
<li></li>
<!-- /wp:list-item -->
<!-- wp:list-item /-->
<!-- wp:list-item -->
<li>two</li>
Expand Down Expand Up @@ -693,9 +689,7 @@ test.describe( 'List (@firefox)', () => {
`<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li>one<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /--></ul>
<!-- /wp:list --></li>
<!-- /wp:list-item --></ul>
<!-- /wp:list -->`
Expand All @@ -708,9 +702,7 @@ test.describe( 'List (@firefox)', () => {
await editor.clickBlockToolbarButton( 'Ordered' );
await expect.poll( editor.getEditedPostContent ).toBe(
`<!-- wp:list {"ordered":true} -->
<ol class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ol>
<ol class="wp-block-list"><!-- wp:list-item /--></ol>
<!-- /wp:list -->`
);
} );
Expand Down Expand Up @@ -1006,9 +998,7 @@ test.describe( 'List (@firefox)', () => {
<li>a</li>
<!-- /wp:list-item -->
<!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<!-- wp:list-item /--></ul>
<!-- /wp:list --></li>
<!-- /wp:list-item --></ul>
<!-- /wp:list -->`
Expand All @@ -1026,9 +1016,7 @@ test.describe( 'List (@firefox)', () => {
<!-- /wp:list --></li>
<!-- /wp:list-item -->
<!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<!-- wp:list-item /--></ul>
<!-- /wp:list -->`
);

Expand All @@ -1055,9 +1043,7 @@ test.describe( 'List (@firefox)', () => {
<li>1</li>
<!-- /wp:list-item -->
<!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<!-- wp:list-item /--></ul>
<!-- /wp:list -->`
);

Expand Down Expand Up @@ -1325,19 +1311,15 @@ test.describe( 'List (@firefox)', () => {
// Add empty list block
await page.getByPlaceholder( 'Start writing with text or HTML' )
.fill( `<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /--></ul>
<!-- /wp:list -->` );

// Go back to normal editor
await pageUtils.pressKeys( 'secondary+M' ); // Emulates CTRL+Shift+Alt + M => toggle code editor

// Verify no WSOD and content is proper.
expect( await editor.getEditedPostContent() ).toBe( `<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /--></ul>
<!-- /wp:list -->` );
} );

Expand Down Expand Up @@ -1398,9 +1380,7 @@ test.describe( 'List (@firefox)', () => {
await page.keyboard.type( '1' );

expect( await editor.getEditedPostContent() ).toBe( `<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /--></ul>
<!-- /wp:list -->
<!-- wp:paragraph -->
Expand Down
4 changes: 1 addition & 3 deletions test/e2e/specs/editor/various/writing-flow.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -314,9 +314,7 @@ test.describe( 'Writing Flow (@firefox, @webkit)', () => {
await page.keyboard.type( 'a' );
await page.keyboard.press( 'Backspace' );
await expect.poll( editor.getEditedPostContent ).toBe( `<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item --></ul>
<ul class="wp-block-list"><!-- wp:list-item /--></ul>
<!-- /wp:list -->` );
} );

Expand Down
4 changes: 1 addition & 3 deletions test/integration/fixtures/documents/mixed-content-out.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,7 @@ <h3 class="wp-block-heading">Some heading</h3>
<!-- /wp:heading -->

<!-- wp:list -->
<ul class="wp-block-list"><!-- wp:list-item -->
<li></li>
<!-- /wp:list-item -->
<ul class="wp-block-list"><!-- wp:list-item /-->

<!-- wp:list-item -->
<li>Content we need to preserve</li>
Expand Down
Loading