Skip to content

Commit 020246c

Browse files
hejsztynxhejsztynx
committed
test: wrapping text in lists tests
1 parent d342007 commit 020246c

9 files changed

Lines changed: 60 additions & 1 deletion

‎.playwright/screenshots/enriched-text-checkbox-list-wrapped.png‎

10.3 KB
Loading

‎.playwright/screenshots/enriched-text-ordered-list-wrapped.png‎

9.56 KB
Loading

‎.playwright/screenshots/enriched-text-unordered-list-wrapped.png‎

9.67 KB
Loading

‎.playwright/screenshots/paragraph-styles-visual-checkbox-list-wrapped.png‎

11.3 KB
Loading

‎.playwright/screenshots/paragraph-styles-visual-ordered-list-wrapped.png‎

10.1 KB
Loading

‎.playwright/screenshots/paragraph-styles-visual-unordered-list-wrapped.png‎

10.1 KB
Loading

‎.playwright/tests/enrichedTextVisual.spec.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,21 @@ test.describe('EnrichedText display visual regression', () => {
7979
snapshot: 'enriched-text-checkbox-list-empty-items.png',
8080
html: '<html><h4>Empty lists</h4><ul data-type="checkbox"><li></li><li checked>one</li><li></li><li>three</li><li checked></li></ul><p>bottom</p></html>',
8181
},
82+
{
83+
name: 'unordered list with wrapped text',
84+
snapshot: 'enriched-text-unordered-list-wrapped.png',
85+
html: '<html><ul><li>This is a very long unordered list item that should naturally wrap onto multiple lines to ensure that the bullet alignment behaves as expected.</li></ul></html>',
86+
},
87+
{
88+
name: 'ordered list with wrapped text',
89+
snapshot: 'enriched-text-ordered-list-wrapped.png',
90+
html: '<html><ol><li>This is a very long ordered list item that should naturally wrap onto multiple lines to ensure that the number alignment behaves as expected.</li></ol></html>',
91+
},
92+
{
93+
name: 'checkbox list with wrapped text',
94+
snapshot: 'enriched-text-checkbox-list-wrapped.png',
95+
html: '<html><ul data-type="checkbox"><li>This is a very long checkbox list item that should naturally wrap onto multiple lines to ensure that the checkbox alignment behaves as expected.</li></ul></html>',
96+
},
8297
];
8398

8499
for (const c of cases) {

‎.playwright/tests/paragraphStylesVisual.spec.ts‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,4 +89,49 @@ test.describe('paragraph styles visual', () => {
8989
'paragraph-styles-visual-checkbox-list.png'
9090
);
9191
});
92+
93+
test('unordered list with wrapped text displays correctly', async ({
94+
page,
95+
}) => {
96+
const html =
97+
'<html><ul><li>This is a very long unordered list item that should naturally wrap onto multiple lines to ensure that the bullet alignment behaves as expected.</li></ul></html>';
98+
await setEditorHtml(page, html);
99+
100+
const editor = editorLocator(page);
101+
await expect(editor).toContainText('as expected');
102+
103+
await expect(editor).toHaveScreenshot(
104+
'paragraph-styles-visual-unordered-list-wrapped.png'
105+
);
106+
});
107+
108+
test('ordered list with wrapped text displays correctly', async ({
109+
page,
110+
}) => {
111+
const html =
112+
'<html><ol><li>This is a very long ordered list item that should naturally wrap onto multiple lines to ensure that the number alignment behaves as expected.</li></ol></html>';
113+
await setEditorHtml(page, html);
114+
115+
const editor = editorLocator(page);
116+
await expect(editor).toContainText('as expected');
117+
118+
await expect(editor).toHaveScreenshot(
119+
'paragraph-styles-visual-ordered-list-wrapped.png'
120+
);
121+
});
122+
123+
test('checkbox list with wrapped text displays correctly', async ({
124+
page,
125+
}) => {
126+
const html =
127+
'<html><ul data-type="checkbox"><li>This is a very long checkbox list item that should naturally wrap onto multiple lines to ensure that the checkbox alignment behaves as expected.</li></ul></html>';
128+
await setEditorHtml(page, html);
129+
130+
const editor = editorLocator(page);
131+
await expect(editor).toContainText('as expected');
132+
133+
await expect(editor).toHaveScreenshot(
134+
'paragraph-styles-visual-checkbox-list-wrapped.png'
135+
);
136+
});
92137
});

‎src/web/EnrichedText.css‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -242,7 +242,6 @@
242242
vertical-align: middle;
243243
position: relative;
244244
top: -0.1em;
245-
user-select: none;
246245
}
247246

248247
.eti-editor ul[data-type='checkboxList'] > li > label input[type='checkbox'] {

0 commit comments

Comments
 (0)