Repository: marktext/marktext
File: src/muya/lib/utils/exportStyledHTML.js (JavaScript)

Code before:

  getHtml () {
    const rawHTML = document.querySelector(`#${CLASS_OR_ID['AG_EDITOR_ID']}`).outerHTML
    const $ = cheerio.load(rawHTML)
    const headingClassNames = [
      'h1', 'h2', 'h3', 'h4', 'h5', 'h6'
    ]
    const removeClassNames = [
      `.${CLASS_OR_ID['AG_REMOVE']}`,
      `.${CLASS_OR_ID['AG_OUTPUT_REMOVE']}`,
      `.${CLASS_OR_ID['AG_EMOJI_MARKER']}`,
      `.${CLASS_OR_ID['AG_TABLE_TOOL_BAR']}`,
      `.${CLASS_OR_ID['AG_MATH_MARKER']}`,
      `.${CLASS_OR_ID['AG_MATH_TEXT']}`,
      '.CodeMirror-cursors'
    ]
    $(removeClassNames.join(', ')).remove()
    $(`.${CLASS_OR_ID['AG_ACTIVE']}`).removeClass(CLASS_OR_ID['AG_ACTIVE'])
    $(`[data-role=hr]`).replaceWith('<hr>')

    // create heading id's
    const headings = $(headingClassNames.join(', '))
    if (headings.length) {
      headings.each((i, h) => {
        const heading = $(h)
        heading.attr('id', `${heading.attr('id')} ${heading.attr('data-id')}`)
      })
    }

    // replace the `emoji text` with actual emoji
    const emojis = $(`span.${CLASS_OR_ID['AG_EMOJI_MARKED_TEXT']}`)
    if (emojis.length > 0) {
      emojis.each((i, e) => {
        const emojiElement = $(e)
        const emoji = emojiElement.attr('data-emoji')

        emojiElement.text(emoji)
      })
    }

    // set checkbox to disabled
    const checkboxs = $(`input.${CLASS_OR_ID['AG_TASK_LIST_ITEM_CHECKBOX']}`)
    if (checkboxs.length) {
      checkboxs.each((i, c) => {
        const checkbox = $(c)
        checkbox.attr('disabled', true)
      })
    }

    // hide math preview bubble
    const mathes = $(`span.${CLASS_OR_ID['AG_MATH']}`)

Review comment (suggestion):
Is there a space between `${...}` and `${...}`?
There should be no space in `id` attribute according to the standard https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id

Code after:

  getHtml () {
    const rawHTML = document.querySelector(`#${CLASS_OR_ID['AG_EDITOR_ID']}`).outerHTML
    const $ = cheerio.load(rawHTML)
    const headingClassNames = [
      'h1', 'h2', 'h3', 'h4', 'h5', 'h6'
    ]
    const removeClassNames = [
      `.${CLASS_OR_ID['AG_REMOVE']}`,
      `.${CLASS_OR_ID['AG_OUTPUT_REMOVE']}`,
      `.${CLASS_OR_ID['AG_EMOJI_MARKER']}`,
      `.${CLASS_OR_ID['AG_TABLE_TOOL_BAR']}`,
      `.${CLASS_OR_ID['AG_MATH_MARKER']}`,
      `.${CLASS_OR_ID['AG_MATH_TEXT']}`,
      '.CodeMirror-cursors'
    ]
    $(removeClassNames.join(', ')).remove()
    $(`.${CLASS_OR_ID['AG_ACTIVE']}`).removeClass(CLASS_OR_ID['AG_ACTIVE'])
    $(`[data-role=hr]`).replaceWith('<hr>')

    // create heading id's
    const headings = $(headingClassNames.join(', '))
    if (headings.length) {
      headings.each((i, h) => {
        const heading = $(h)
        heading.attr('id', heading.attr('data-id'))
      })
    }

    // replace the `emoji text` with actual emoji
    const emojis = $(`span.${CLASS_OR_ID['AG_EMOJI_MARKED_TEXT']}`)
    if (emojis.length > 0) {
      emojis.each((i, e) => {
        const emojiElement = $(e)
        const emoji = emojiElement.attr('data-emoji')

        emojiElement.text(emoji)
      })
    }

    // set checkbox to disabled
    const checkboxs = $(`input.${CLASS_OR_ID['AG_TASK_LIST_ITEM_CHECKBOX']}`)
    if (checkboxs.length) {
      checkboxs.each((i, c) => {
        const checkbox = $(c)
        checkbox.attr('disabled', true)
      })
    }

    // hide math preview bubble
    const mathes = $(`span.${CLASS_OR_ID['AG_MATH']}`)