diff options
Diffstat (limited to 'packages/integrations/markdoc/test/render-html.test.js')
-rw-r--r-- | packages/integrations/markdoc/test/render-html.test.js | 175 |
1 files changed, 88 insertions, 87 deletions
diff --git a/packages/integrations/markdoc/test/render-html.test.js b/packages/integrations/markdoc/test/render-html.test.js index a0c38ace3..d83a91607 100644 --- a/packages/integrations/markdoc/test/render-html.test.js +++ b/packages/integrations/markdoc/test/render-html.test.js @@ -1,6 +1,7 @@ import { parseHTML } from 'linkedom'; -import { expect } from 'chai'; import { loadFixture } from '../../../astro/test/test-utils.js'; +import assert from 'node:assert/strict'; +import { after, before, describe, it } from 'node:test'; async function getFixture(name) { return await loadFixture({ @@ -91,24 +92,24 @@ function renderSimpleChecks(html) { const { document } = parseHTML(html); const h2 = document.querySelector('h2'); - expect(h2.textContent).to.equal('Simple post header'); + assert.equal(h2.textContent, 'Simple post header'); const spanInsideH2 = document.querySelector('h2 > span'); - expect(spanInsideH2.textContent).to.equal('post'); - expect(spanInsideH2.className).to.equal('inside-h2'); - expect(spanInsideH2.style.color).to.equal('fuscia'); + assert.equal(spanInsideH2.textContent, 'post'); + assert.equal(spanInsideH2.className, 'inside-h2'); + assert.equal(spanInsideH2.style.color, 'fuscia'); const p1 = document.querySelector('article > p:nth-of-type(1)'); - expect(p1.children.length).to.equal(1); - expect(p1.textContent).to.equal('This is a simple Markdoc post.'); + assert.equal(p1.children.length, 1); + assert.equal(p1.textContent, 'This is a simple Markdoc post.'); const p2 = document.querySelector('article > p:nth-of-type(2)'); - expect(p2.children.length).to.equal(0); - expect(p2.textContent).to.equal('This is a paragraph!'); + assert.equal(p2.children.length, 0); + assert.equal(p2.textContent, 'This is a paragraph!'); const p3 = document.querySelector('article > p:nth-of-type(3)'); - expect(p3.children.length).to.equal(1); - expect(p3.textContent).to.equal('This is a span inside a paragraph!'); + assert.equal(p3.children.length, 1); + assert.equal(p3.textContent, 'This is a span inside a paragraph!'); } /** @param {string} html */ @@ -116,47 +117,47 @@ function renderNestedHTMLChecks(html) { const { document } = parseHTML(html); const p1 = document.querySelector('p:nth-of-type(1)'); - expect(p1.id).to.equal('p1'); - expect(p1.textContent).to.equal('before inner after'); - expect(p1.children.length).to.equal(1); + assert.equal(p1.id, 'p1'); + assert.equal(p1.textContent, 'before inner after'); + assert.equal(p1.children.length, 1); const p1Span1 = p1.querySelector('span'); - expect(p1Span1.textContent).to.equal('inner'); - expect(p1Span1.id).to.equal('inner1'); - expect(p1Span1.className).to.equal('inner-class'); - expect(p1Span1.style.color).to.equal('hotpink'); + assert.equal(p1Span1.textContent, 'inner'); + assert.equal(p1Span1.id, 'inner1'); + assert.equal(p1Span1.className, 'inner-class'); + assert.equal(p1Span1.style.color, 'hotpink'); const p2 = document.querySelector('p:nth-of-type(2)'); - expect(p2.id).to.equal('p2'); - expect(p2.textContent).to.equal('\n before\n inner\n after\n'); - expect(p2.children.length).to.equal(1); + assert.equal(p2.id, 'p2'); + assert.equal(p2.textContent, '\n before\n inner\n after\n'); + assert.equal(p2.children.length, 1); const divL1 = document.querySelector('div:nth-of-type(1)'); - expect(divL1.id).to.equal('div-l1'); - expect(divL1.children.length).to.equal(2); + assert.equal(divL1.id, 'div-l1'); + assert.equal(divL1.children.length, 2); const divL2_1 = divL1.querySelector('div:nth-of-type(1)'); - expect(divL2_1.id).to.equal('div-l2-1'); - expect(divL2_1.children.length).to.equal(1); + assert.equal(divL2_1.id, 'div-l2-1'); + assert.equal(divL2_1.children.length, 1); const p3 = divL2_1.querySelector('p:nth-of-type(1)'); - expect(p3.id).to.equal('p3'); - expect(p3.textContent).to.equal('before inner after'); - expect(p3.children.length).to.equal(1); + assert.equal(p3.id, 'p3'); + assert.equal(p3.textContent, 'before inner after'); + assert.equal(p3.children.length, 1); const divL2_2 = divL1.querySelector('div:nth-of-type(2)'); - expect(divL2_2.id).to.equal('div-l2-2'); - expect(divL2_2.children.length).to.equal(2); + assert.equal(divL2_2.id, 'div-l2-2'); + assert.equal(divL2_2.children.length, 2); const p4 = divL2_2.querySelector('p:nth-of-type(1)'); - expect(p4.id).to.equal('p4'); - expect(p4.textContent).to.equal('before inner after'); - expect(p4.children.length).to.equal(1); + assert.equal(p4.id, 'p4'); + assert.equal(p4.textContent, 'before inner after'); + assert.equal(p4.children.length, 1); const p5 = divL2_2.querySelector('p:nth-of-type(2)'); - expect(p5.id).to.equal('p5'); - expect(p5.textContent).to.equal('before inner after'); - expect(p5.children.length).to.equal(1); + assert.equal(p5.id, 'p5'); + assert.equal(p5.textContent, 'before inner after'); + assert.equal(p5.children.length, 1); } /** @@ -172,17 +173,17 @@ function renderRandomlyCasedHTMLAttributesChecks(html) { // all four <td>'s which had randomly cased variants of colspan/rowspan should all be rendered lowercased at this point - expect(td1.getAttribute('colspan')).to.equal('3'); - expect(td1.getAttribute('rowspan')).to.equal('2'); + assert.equal(td1.getAttribute('colspan'), '3'); + assert.equal(td1.getAttribute('rowspan'), '2'); - expect(td2.getAttribute('colspan')).to.equal('3'); - expect(td2.getAttribute('rowspan')).to.equal('2'); + assert.equal(td2.getAttribute('colspan'), '3'); + assert.equal(td2.getAttribute('rowspan'), '2'); - expect(td3.getAttribute('colspan')).to.equal('3'); - expect(td3.getAttribute('rowspan')).to.equal('2'); + assert.equal(td3.getAttribute('colspan'), '3'); + assert.equal(td3.getAttribute('rowspan'), '2'); - expect(td4.getAttribute('colspan')).to.equal('3'); - expect(td4.getAttribute('rowspan')).to.equal('2'); + assert.equal(td4.getAttribute('colspan'), '3'); + assert.equal(td4.getAttribute('rowspan'), '2'); } /** @@ -193,95 +194,95 @@ function renderComponentsHTMLChecks(html) { const { document } = parseHTML(html); const naturalP1 = document.querySelector('article > p:nth-of-type(1)'); - expect(naturalP1.textContent).to.equal('This is a inline mark in regular Markdown markup.'); - expect(naturalP1.children.length).to.equal(1); + assert.equal(naturalP1.textContent, 'This is a inline mark in regular Markdown markup.'); + assert.equal(naturalP1.children.length, 1); const p1 = document.querySelector('article > p:nth-of-type(2)'); - expect(p1.id).to.equal('p1'); - expect(p1.textContent).to.equal('This is a inline mark under some HTML'); - expect(p1.children.length).to.equal(1); + assert.equal(p1.id, 'p1'); + assert.equal(p1.textContent, 'This is a inline mark under some HTML'); + assert.equal(p1.children.length, 1); assertInlineMark(p1.children[0]); const div1p1 = document.querySelector('article > #div1 > p:nth-of-type(1)'); - expect(div1p1.id).to.equal('div1-p1'); - expect(div1p1.textContent).to.equal('This is a inline mark under some HTML'); - expect(div1p1.children.length).to.equal(1); + assert.equal(div1p1.id, 'div1-p1'); + assert.equal(div1p1.textContent, 'This is a inline mark under some HTML'); + assert.equal(div1p1.children.length, 1); assertInlineMark(div1p1.children[0]); const div1p2 = document.querySelector('article > #div1 > p:nth-of-type(2)'); - expect(div1p2.id).to.equal('div1-p2'); - expect(div1p2.textContent).to.equal('This is a inline mark under some HTML'); - expect(div1p2.children.length).to.equal(1); + assert.equal(div1p2.id, 'div1-p2'); + assert.equal(div1p2.textContent, 'This is a inline mark under some HTML'); + assert.equal(div1p2.children.length, 1); const div1p2span1 = div1p2.querySelector('span'); - expect(div1p2span1.id).to.equal('div1-p2-span1'); - expect(div1p2span1.textContent).to.equal('inline mark'); - expect(div1p2span1.children.length).to.equal(1); + assert.equal(div1p2span1.id, 'div1-p2-span1'); + assert.equal(div1p2span1.textContent, 'inline mark'); + assert.equal(div1p2span1.children.length, 1); assertInlineMark(div1p2span1.children[0]); const aside1 = document.querySelector('article > aside:nth-of-type(1)'); const aside1Title = aside1.querySelector('p.title'); - expect(aside1Title.textContent.trim()).to.equal('Aside One'); + assert.equal(aside1Title.textContent.trim(), 'Aside One'); const aside1Section = aside1.querySelector('section'); const aside1SectionP1 = aside1Section.querySelector('p:nth-of-type(1)'); - expect(aside1SectionP1.textContent).to.equal( + assert.equal( + aside1SectionP1.textContent, "I'm a Markdown paragraph inside an top-level aside tag" ); const aside1H2_1 = aside1Section.querySelector('h2:nth-of-type(1)'); - expect(aside1H2_1.id).to.equal('im-an-h2-via-markdown-markup'); // automatic slug - expect(aside1H2_1.textContent).to.equal("I'm an H2 via Markdown markup"); + assert.equal(aside1H2_1.id, 'im-an-h2-via-markdown-markup'); // automatic slug + assert.equal(aside1H2_1.textContent, "I'm an H2 via Markdown markup"); const aside1H2_2 = aside1Section.querySelector('h2:nth-of-type(2)'); - expect(aside1H2_2.id).to.equal('h-two'); - expect(aside1H2_2.textContent).to.equal("I'm an H2 via HTML markup"); + assert.equal(aside1H2_2.id, 'h-two'); + assert.equal(aside1H2_2.textContent, "I'm an H2 via HTML markup"); const aside1SectionP2 = aside1Section.querySelector('p:nth-of-type(2)'); - expect(aside1SectionP2.textContent).to.equal('Markdown bold vs HTML bold'); - expect(aside1SectionP2.children.length).to.equal(2); + assert.equal(aside1SectionP2.textContent, 'Markdown bold vs HTML bold'); + assert.equal(aside1SectionP2.children.length, 2); const aside1SectionP2Strong1 = aside1SectionP2.querySelector('strong:nth-of-type(1)'); - expect(aside1SectionP2Strong1.textContent).to.equal('Markdown bold'); + assert.equal(aside1SectionP2Strong1.textContent, 'Markdown bold'); const aside1SectionP2Strong2 = aside1SectionP2.querySelector('strong:nth-of-type(2)'); - expect(aside1SectionP2Strong2.textContent).to.equal('HTML bold'); + assert.equal(aside1SectionP2Strong2.textContent, 'HTML bold'); const article = document.querySelector('article'); - expect(article.textContent).to.contain('RENDERED'); - expect(article.textContent).to.not.contain('NOT RENDERED'); + assert.equal(article.textContent.includes('RENDERED'), true); + assert.notEqual(article.textContent.includes('NOT RENDERED'), true); const section1 = document.querySelector('article > #section1'); const section1div1 = section1.querySelector('#div1'); const section1Aside1 = section1div1.querySelector('aside:nth-of-type(1)'); const section1Aside1Title = section1Aside1.querySelector('p.title'); - expect(section1Aside1Title.textContent.trim()).to.equal('Nested un-indented Aside'); + assert.equal(section1Aside1Title.textContent.trim(), 'Nested un-indented Aside'); const section1Aside1Section = section1Aside1.querySelector('section'); const section1Aside1SectionP1 = section1Aside1Section.querySelector('p:nth-of-type(1)'); - expect(section1Aside1SectionP1.textContent).to.equal('regular Markdown markup'); + assert.equal(section1Aside1SectionP1.textContent, 'regular Markdown markup'); const section1Aside1SectionP4 = section1Aside1Section.querySelector('p:nth-of-type(2)'); - expect(section1Aside1SectionP4.textContent).to.equal('nested inline mark content'); - expect(section1Aside1SectionP4.children.length).to.equal(1); + assert.equal(section1Aside1SectionP4.textContent, 'nested inline mark content'); + assert.equal(section1Aside1SectionP4.children.length, 1); assertInlineMark(section1Aside1SectionP4.children[0]); const section1div2 = section1.querySelector('#div2'); const section1Aside2 = section1div2.querySelector('aside:nth-of-type(1)'); const section1Aside2Title = section1Aside2.querySelector('p.title'); - expect(section1Aside2Title.textContent.trim()).to.equal('Nested indented Aside 💀'); + assert.equal(section1Aside2Title.textContent.trim(), 'Nested indented Aside 💀'); const section1Aside2Section = section1Aside2.querySelector('section'); const section1Aside2SectionP1 = section1Aside2Section.querySelector('p:nth-of-type(1)'); - expect(section1Aside2SectionP1.textContent).to.equal('regular Markdown markup'); + assert.equal(section1Aside2SectionP1.textContent, 'regular Markdown markup'); const section1Aside1SectionP5 = section1Aside2Section.querySelector('p:nth-of-type(2)'); - expect(section1Aside1SectionP5.id).to.equal('p5'); - expect(section1Aside1SectionP5.children.length).to.equal(1); + assert.equal(section1Aside1SectionP5.id, 'p5'); + assert.equal(section1Aside1SectionP5.children.length, 1); const section1Aside1SectionP5Span1 = section1Aside1SectionP5.children[0]; - expect(section1Aside1SectionP5Span1.textContent).to.equal('inline mark'); - expect(section1Aside1SectionP5Span1.children.length).to.equal(1); + assert.equal(section1Aside1SectionP5Span1.textContent, 'inline mark'); + assert.equal(section1Aside1SectionP5Span1.children.length, 1); const section1Aside1SectionP5Span1Span1 = section1Aside1SectionP5Span1.children[0]; - expect(section1Aside1SectionP5Span1Span1.textContent).to.equal(' mark'); + assert.equal(section1Aside1SectionP5Span1Span1.textContent, ' mark'); } /** @param {HTMLElement | null | undefined} el */ function assertInlineMark(el) { - expect(el).to.not.be.null; - expect(el).to.not.be.undefined; - expect(el.children.length).to.equal(0); - expect(el.textContent).to.equal('inline mark'); - expect(el.className).to.equal('mark'); - expect(el.style.color).to.equal('hotpink'); + assert.ok(el); + assert.equal(el.children.length, 0); + assert.equal(el.textContent, 'inline mark'); + assert.equal(el.className, 'mark'); + assert.equal(el.style.color, 'hotpink'); } |