Skip to content

Commit bb1edff

Browse files
hejsztynxhejsztynx
committed
refactor: cleanup
1 parent dfd8915 commit bb1edff

13 files changed

Lines changed: 26 additions & 27 deletions

‎.playwright/screenshots/enriched-text-blockquote-code-codeblock.png‎

-796 Bytes
Loading

‎.playwright/screenshots/enriched-text-images-placeholder-list.png‎

128 Bytes
Loading

.playwright/tests/enrichedText.spec.ts renamed to .playwright/tests/enrichedTextVisual.spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -127,7 +127,7 @@ test.describe('visual: typography, blocks, and wrapping', () => {
127127
snapshot: 'enriched-text-blockquote-code-codeblock.png',
128128
html: [
129129
'<html>',
130-
'<blockquote><p>This is a blockquote. It should have a border and padding.</p></blockquote>',
130+
'<blockquote><p>This is a blockquote. Blockquote for quoting in a block.</p></blockquote>',
131131
'<p>Here is some <code>inline code</code> mixed in text.</p>',
132132
'<codeblock><p>function test() {</p><p> return true;</p><p>}</p></codeblock>',
133133
'</html>',
@@ -218,7 +218,7 @@ test.describe('visual: images', () => {
218218
{
219219
name: 'image placeholder inside lists',
220220
snapshot: 'enriched-text-images-placeholder-list.png',
221-
html: '<html><ol><li>Broken inside list <img src="" width="20" height="20" /> right here.</li></ol></html>',
221+
html: '<html><ol><li>List with a broken image <img src="" width="20" height="20" /> inside.</li></ol></html>',
222222
},
223223
];
224224

‎apps/example-web/src/App.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -233,7 +233,6 @@ function App() {
233233
ref.current
234234
?.getHTML()
235235
.then((html) => {
236-
console.log('getHtml', html);
237236
setEnrichedTextValue(html);
238237
})
239238
.catch((error: unknown) => {

‎src/web/EnrichedText.css‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -312,9 +312,8 @@
312312
}
313313

314314
.et-view img.error {
315-
/* hide the browser's broken-image alt text; the ::before overlay covers
316-
the native broken-image icon. We keep `color` intact so the glyph below
317-
can inherit the surrounding text color via currentColor. */
315+
/* hide the browser's broken-image alt text;
316+
the ::before overlay covers the native broken-image icon. */
318317
font-size: 0;
319318
visibility: hidden;
320319
}

‎src/web/EnrichedText.tsx‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import './EnrichedText.css';
44
import { enrichedTextStyleToCSSProperties } from './styleConversion/enrichedTextStyleToCSSProperties';
55
import { htmlStyleToCSSVariables } from './styleConversion/htmlStyleToCSSVariables';
66
import { ENRICHED_TEXT_CLASSNAME } from './constants/classNames';
7-
import { enrichedInputThemingToCSSProperties } from './styleConversion/enrichedInputThemingToCSSProperties';
7+
import { enrichedInputThemingToCSSProperties } from './styleConversion/enrichedThemingToCSSProperties';
88
import { buildMentionRulesCSS } from './styleConversion/buildMentionRulesCSS';
99
import { sanitizeHtml } from './sanitization/htmlSanitizer';
1010
import { prepareHtmlForWeb } from './normalization/prepareHtmlForWeb';
@@ -14,8 +14,6 @@ export const EnrichedText = memo(
1414
({ children, htmlStyle, style, selectionColor }: EnrichedTextProps) => {
1515
const sanitizedHtml = useMemo(() => sanitizeHtml(children), [children]);
1616

17-
console.log('rerender enriched');
18-
1917
const finalHtml = useMemo(
2018
() => prepareHtmlForWeb(sanitizedHtml),
2119
[sanitizedHtml]

‎src/web/EnrichedTextInput.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ import {
3838
} from './normalization/tiptapHtmlNormalizer';
3939
import { ENRICHED_TEXT_INPUT_DEFAULT_PROPS } from '../utils/EnrichedTextInputDefaultProps';
4040
import { enrichedInputStyleToCSSProperties } from './styleConversion/enrichedInputStyleToCSSProperties';
41-
import { enrichedInputThemingToCSSProperties } from './styleConversion/enrichedInputThemingToCSSProperties';
41+
import { enrichedInputThemingToCSSProperties } from './styleConversion/enrichedThemingToCSSProperties';
4242
import { buildMentionRulesCSS } from './styleConversion/buildMentionRulesCSS';
4343
import {
4444
htmlStyleToCSSVariables,

‎src/web/constants/brokenImageGlyph.ts‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
// SVG path of the broken-image glyph, shared between the editor's image
2-
// node view (rendered as an inline <svg>).
1+
// SVG path of the broken-image glyph, shared between the editor's
2+
// image node view (rendered as an inline <svg>).
33
export const BROKEN_IMAGE_PATH_D =
44
'M200,840Q167,840 143.5,816.5Q120,793 120,760L120,200Q120,167 143.5,143.5Q167,120 200,120L760,120Q793,120 816.5,143.5Q840,167 840,200L840,760Q840,793 816.5,816.5Q793,840 760,840L200,840ZM240,503L400,343L560,503L720,343L760,383L760,200Q760,200 760,200Q760,200 760,200L200,200Q200,200 200,200Q200,200 200,200L200,463L240,503ZM200,760L760,760Q760,760 760,760Q760,760 760,760L760,496L720,456L560,616L400,456L240,616L200,576L200,760Q200,760 200,760Q200,760 200,760ZM200,760L200,760Q200,760 200,760Q200,760 200,760L200,496L200,576L200,463L200,383L200,200Q200,200 200,200Q200,200 200,200L200,200Q200,200 200,200Q200,200 200,200L200,463L200,463L200,576L200,576L200,760Q200,760 200,760Q200,760 200,760Z';
55

6-
// Glyph as a `mask`-ready data URI, consumed via the
7-
// `--et-broken-image-glyph` custom property in EnrichedText.css.
6+
// Glyph as a `mask`-ready data URI, used in EnrichedText.css.
87
export const BROKEN_IMAGE_GLYPH_MASK = `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 960 960'%3E%3Cpath d='${BROKEN_IMAGE_PATH_D}'/%3E%3C/svg%3E")`;

‎src/web/normalization/prepareHtmlForWeb.ts‎

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -37,31 +37,28 @@ function addImageErrorFallback(html: string): string {
3737
* Web-native, display-only format:
3838
* <ul data-type="checkbox">
3939
* <li>
40-
* <input type="checkbox" id="…" checked>
41-
* <label for="…">foo</label>
40+
* <input type="checkbox" checked>
41+
* <label>foo</label>
4242
* </li>
4343
* <li>
44-
* <input type="checkbox" id="…">
45-
* <label for="…">bar</label>
44+
* <input type="checkbox">
45+
* <label>bar</label>
4646
* </li>
4747
* </ul>
4848
*/
4949
function checkboxHtmlToWeb(html: string): string {
5050
const parser = new DOMParser();
5151
const doc = parser.parseFromString(html, 'text/html');
5252

53-
let idCounter = 0;
54-
5553
doc.querySelectorAll('ul[data-type="checkbox"]').forEach((ul) => {
5654
ul.querySelectorAll('li').forEach((li) => {
5755
const checked = li.hasAttribute('checked');
58-
const id = `enriched-checkbox-${idCounter++}`;
5956
const labelContent = li.innerHTML;
6057

6158
li.removeAttribute('checked');
6259
li.innerHTML =
63-
`<input type="checkbox" id="${id}"${checked ? ' checked' : ''}>` +
64-
`<label for="${id}">${labelContent}</label>`;
60+
`<input type="checkbox"${checked ? ' checked' : ''}>` +
61+
`<label>${labelContent}</label>`;
6562
});
6663
});
6764

‎src/web/styleConversion/__tests__/enrichedTextStyleToCSSProperties.test.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ function convert(style: TextStyle): CSSProperties {
1414

1515
// These suites only cover the text-only properties that
1616
// enrichedTextStyleToCSSProperties adds on top of the shared base.
17-
// The shared (ViewStyle) conversions are covered by the base function's tests.
1817

1918
describe('empty input', () => {
2019
it('returns an empty object for an empty style', () => {

0 commit comments

Comments
 (0)