diff --git a/src/lib/parser/DeckParser.ts b/src/lib/parser/DeckParser.ts index ffaaa84c..2d1ed3e2 100644 --- a/src/lib/parser/DeckParser.ts +++ b/src/lib/parser/DeckParser.ts @@ -24,6 +24,8 @@ import { isImageFileEmbedable, isMarkdownFile } from '../storage/checks'; import { getFileContents } from './getFileContents'; import { handleNestedBulletPointsInMarkdown } from './handleNestedBulletPointsInMarkdown'; import { checkFlashcardsLimits } from '../User/checkFlashcardsLimits'; +import { extractStyles } from './extractStyles'; +import { withFontSize } from './withFontSize'; export interface DeckParserInput { name: string; @@ -135,16 +137,6 @@ export class DeckParser { .replace('', ''); } - setFontSize(style: string) { - let { fontSize } = this.settings; - if (fontSize && fontSize !== '20px') { - // For backwards compatability, don't touch the font-size if it's 20px - fontSize = fontSize.trim().endsWith('px') ? fontSize : `${fontSize}px`; - style += '\n' + `* { font-size:${fontSize}}`; - } - return style; - } - getLink(pageId: string | undefined, note: Note): string | null { try { const page = pageId!.replace(/-/g, ''); @@ -195,7 +187,7 @@ export class DeckParser { decks: Deck[] ) { let dom = this.loadDOM(contents); - const style = this.extractStyle(dom); + const style = withFontSize(extractStyles(dom), this.settings.fontSize); let image: string | undefined = this.extractCoverImage(dom); const name = this.extractName( @@ -513,15 +505,6 @@ export class DeckParser { ); } - private extractStyle(dom: cheerio.Root) { - let style = dom('style').html(); - if (style) { - style = style.replace(/white-space: pre-wrap;/g, ''); - return this.setFontSize(style); - } - return null; - } - private extractCoverImage(dom: cheerio.Root) { const pageCoverImage = dom('.page-cover-image'); if (pageCoverImage) { diff --git a/src/lib/parser/extractStyles.test.ts b/src/lib/parser/extractStyles.test.ts new file mode 100644 index 00000000..b1a70ed3 --- /dev/null +++ b/src/lib/parser/extractStyles.test.ts @@ -0,0 +1,36 @@ +import cheerio from 'cheerio'; +import { extractStyles } from './extractStyles'; + +describe('extractStyles', () => { + it('should remove list-style-type changes', () => { + const page = cheerio.load(` + + `); + + const result = extractStyles(page); + expect(result?.trim()).toEqual( + `.toggle { +\tpadding-inline-start: 0em; +\t +}`.trim() + ); + }); + + it('should remove white-space: pre-wrap', () => { + const page = cheerio.load(` + `); + const result = extractStyles(page); + expect(result?.trim()).toEqual( + `.toggle { +\tpadding-inline-start: 0em; +\t +}`.trim() + ); + }); +}); diff --git a/src/lib/parser/extractStyles.ts b/src/lib/parser/extractStyles.ts new file mode 100644 index 00000000..fefce047 --- /dev/null +++ b/src/lib/parser/extractStyles.ts @@ -0,0 +1,20 @@ +import cheerio from 'cheerio'; + +/** + * Extracts the styles from the page and removes formatting issues. + * + * Removing list-style-type changes (makes nested toggles work) + * Removing white-space: pre-wrap (don't remember why) + * + * @param page + */ +export function extractStyles(page: cheerio.Root) { + let style = page('style').html(); + if (!style) { + return null; + } + + return style + .replace(/white-space: pre-wrap;/g, '') + .replace(/list-style-type: none;/g, ''); +} diff --git a/src/lib/parser/withFontSize.ts b/src/lib/parser/withFontSize.ts new file mode 100644 index 00000000..0367d5a5 --- /dev/null +++ b/src/lib/parser/withFontSize.ts @@ -0,0 +1,8 @@ +export function withFontSize(style: string | null, fontSize?: string) { + if (style && fontSize && fontSize !== '20px') { + // For backwards compatability, don't touch the font-size if it's 20px + fontSize = fontSize.trim().endsWith('px') ? fontSize : `${fontSize}px`; + style += '\n' + `* { font-size:${fontSize}}`; + } + return style; +}