mdx-frontmatter.test.js 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. import mdx from '@astrojs/mdx';
  2. import { describe, it, before } from 'node:test';
  3. import * as assert from 'node:assert/strict';
  4. import { parseHTML } from 'linkedom';
  5. import { loadFixture } from '../../../astro/test/test-utils.js';
  6. const FIXTURE_ROOT = new URL('./fixtures/mdx-frontmatter/', import.meta.url);
  7. describe('MDX frontmatter', () => {
  8. let fixture;
  9. before(async () => {
  10. fixture = await loadFixture({
  11. root: FIXTURE_ROOT,
  12. integrations: [mdx()],
  13. });
  14. await fixture.build();
  15. });
  16. it('builds when "frontmatter.property" is in JSX expression', async () => {
  17. assert.equal(true, true);
  18. });
  19. it('extracts frontmatter to "frontmatter" export', async () => {
  20. const { titles } = JSON.parse(await fixture.readFile('/glob.json'));
  21. assert.equal(titles.includes('Using YAML frontmatter'), true);
  22. });
  23. it('renders layout from "layout" frontmatter property', async () => {
  24. const html = await fixture.readFile('/index.html');
  25. const { document } = parseHTML(html);
  26. const layoutParagraph = document.querySelector('[data-layout-rendered]');
  27. assert.notEqual(layoutParagraph, null);
  28. });
  29. it('passes frontmatter to layout via "content" and "frontmatter" props', async () => {
  30. const html = await fixture.readFile('/index.html');
  31. const { document } = parseHTML(html);
  32. const contentTitle = document.querySelector('[data-content-title]');
  33. const frontmatterTitle = document.querySelector('[data-frontmatter-title]');
  34. assert.equal(contentTitle.textContent, 'Using YAML frontmatter');
  35. assert.equal(frontmatterTitle.textContent, 'Using YAML frontmatter');
  36. });
  37. it('passes headings to layout via "headings" prop', async () => {
  38. const html = await fixture.readFile('/with-headings/index.html');
  39. const { document } = parseHTML(html);
  40. const headingSlugs = [...document.querySelectorAll('[data-headings] > li')].map(
  41. (el) => el.textContent
  42. );
  43. assert.equal(headingSlugs.length > 0, true);
  44. assert.equal(headingSlugs.includes('section-1'), true);
  45. assert.equal(headingSlugs.includes('section-2'), true);
  46. });
  47. it('passes "file" and "url" to layout', async () => {
  48. const html = await fixture.readFile('/with-headings/index.html');
  49. const { document } = parseHTML(html);
  50. const frontmatterFile = document.querySelector('[data-frontmatter-file]')?.textContent;
  51. const frontmatterUrl = document.querySelector('[data-frontmatter-url]')?.textContent;
  52. const file = document.querySelector('[data-file]')?.textContent;
  53. const url = document.querySelector('[data-url]')?.textContent;
  54. assert.equal(
  55. frontmatterFile?.endsWith('with-headings.mdx'),
  56. true,
  57. '"file" prop does not end with correct path or is undefined'
  58. );
  59. assert.equal(frontmatterUrl, '/with-headings');
  60. assert.equal(file, frontmatterFile);
  61. assert.equal(url, frontmatterUrl);
  62. });
  63. });