@astrojs/mdx 0.5.0 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
- @astrojs/mdx:build: cache hit, replaying output 87ac7debf5e14016
2
- @astrojs/mdx:build: 
3
- @astrojs/mdx:build: > @astrojs/mdx@0.5.0 build /home/runner/work/astro/astro/packages/integrations/mdx
4
- @astrojs/mdx:build: > astro-scripts build "src/**/*.ts" && tsc
5
- @astrojs/mdx:build: 
1
+ @astrojs/mdx:build: cache hit, replaying output db9da5c9ed100942
2
+ @astrojs/mdx:build: 
3
+ @astrojs/mdx:build: > @astrojs/mdx@0.6.0 build /home/runner/work/astro/astro/packages/integrations/mdx
4
+ @astrojs/mdx:build: > astro-scripts build "src/**/*.ts" && tsc
5
+ @astrojs/mdx:build: 
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @astrojs/mdx
2
2
 
3
+ ## 0.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#4134](https://github.com/withastro/astro/pull/4134) [`2968ba2b6`](https://github.com/withastro/astro/commit/2968ba2b6f00775b6e9872681b390cb466fdbfa2) Thanks [@bholmesdev](https://github.com/bholmesdev)! - Add `headings` and `frontmatter` properties to layout props
8
+
3
9
  ## 0.5.0
4
10
 
5
11
  ### Minor Changes
package/dist/index.js CHANGED
@@ -72,9 +72,10 @@ export default async function({ children }) {
72
72
  const Layout = (await import(${JSON.stringify(
73
73
  frontmatter.layout
74
74
  )})).default;
75
- return <Layout content={${JSON.stringify(
75
+ const frontmatter=${JSON.stringify(
76
76
  content
77
- )}}>{children}</Layout> }`;
77
+ )};
78
+ return <Layout frontmatter={frontmatter} content={frontmatter} headings={getHeadings()}>{children}</Layout> }`;
78
79
  }
79
80
  }
80
81
  const compiled = await mdxCompile(
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@astrojs/mdx",
3
3
  "description": "Use MDX within Astro",
4
- "version": "0.5.0",
4
+ "version": "0.6.0",
5
5
  "type": "module",
6
6
  "types": "./dist/index.d.ts",
7
7
  "author": "withastro",
@@ -14,7 +14,6 @@
14
14
  "keywords": [
15
15
  "astro-integration",
16
16
  "astro-component",
17
- "renderer",
18
17
  "mdx"
19
18
  ],
20
19
  "bugs": "https://github.com/withastro/astro/issues",
@@ -44,7 +43,7 @@
44
43
  "@types/chai": "^4.3.1",
45
44
  "@types/mocha": "^9.1.1",
46
45
  "@types/yargs-parser": "^21.0.0",
47
- "astro": "1.0.0-rc.4",
46
+ "astro": "1.0.0-rc.5",
48
47
  "astro-scripts": "0.0.6",
49
48
  "chai": "^4.3.6",
50
49
  "linkedom": "^0.14.12",
package/src/index.ts CHANGED
@@ -101,9 +101,9 @@ export default function mdx(mdxOptions: MdxOptions = {}): AstroIntegration {
101
101
  const { layout, ...content } = frontmatter;
102
102
  code += `\nexport default async function({ children }) {\nconst Layout = (await import(${JSON.stringify(
103
103
  frontmatter.layout
104
- )})).default;\nreturn <Layout content={${JSON.stringify(
104
+ )})).default;\nconst frontmatter=${JSON.stringify(
105
105
  content
106
- )}}>{children}</Layout> }`;
106
+ )};\nreturn <Layout frontmatter={frontmatter} content={frontmatter} headings={getHeadings()}>{children}</Layout> }`;
107
107
  }
108
108
  }
109
109
 
@@ -1,18 +1,28 @@
1
1
  ---
2
- const { content = { title: "Didn't work" } } = Astro.props;
2
+ const {
3
+ content = { title: "content didn't work" },
4
+ frontmatter = { title: "frontmatter didn't work" },
5
+ headings = [],
6
+ } = Astro.props;
3
7
  ---
4
8
 
5
9
  <!DOCTYPE html>
6
10
  <html lang="en">
11
+
7
12
  <head>
8
13
  <meta charset="UTF-8">
9
14
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
10
15
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
11
- <title>{content.title}</title>
12
16
  </head>
17
+
13
18
  <body>
14
- <h1>{content.title}</h1>
19
+ <p data-content-title>{content.title}</p>
20
+ <p data-frontmatter-title>{frontmatter.title}</p>
15
21
  <p data-layout-rendered>Layout rendered!</p>
22
+ <ul data-headings>
23
+ {headings.map(heading => <li>{heading.slug}</li>)}
24
+ </ul>
16
25
  <slot />
17
26
  </body>
27
+
18
28
  </html>
@@ -0,0 +1,7 @@
1
+ ---
2
+ layout: '../layouts/Base.astro'
3
+ ---
4
+
5
+ ## Section 1
6
+
7
+ ## Section 2
@@ -7,33 +7,24 @@ import { loadFixture } from '../../../astro/test/test-utils.js';
7
7
  const FIXTURE_ROOT = new URL('./fixtures/mdx-frontmatter/', import.meta.url);
8
8
 
9
9
  describe('MDX frontmatter', () => {
10
- it('builds when "frontmatter.property" is in JSX expression', async () => {
11
- const fixture = await loadFixture({
10
+ let fixture;
11
+ before(async () => {
12
+ fixture = await loadFixture({
12
13
  root: FIXTURE_ROOT,
13
14
  integrations: [mdx()],
14
15
  });
15
16
  await fixture.build();
17
+ });
18
+ it('builds when "frontmatter.property" is in JSX expression', async () => {
16
19
  expect(true).to.equal(true);
17
20
  });
18
21
 
19
22
  it('extracts frontmatter to "frontmatter" export', async () => {
20
- const fixture = await loadFixture({
21
- root: FIXTURE_ROOT,
22
- integrations: [mdx()],
23
- });
24
- await fixture.build();
25
-
26
23
  const { titles } = JSON.parse(await fixture.readFile('/glob.json'));
27
24
  expect(titles).to.include('Using YAML frontmatter');
28
25
  });
29
26
 
30
27
  it('renders layout from "layout" frontmatter property', async () => {
31
- const fixture = await loadFixture({
32
- root: FIXTURE_ROOT,
33
- integrations: [mdx()],
34
- });
35
- await fixture.build();
36
-
37
28
  const html = await fixture.readFile('/index.html');
38
29
  const { document } = parseHTML(html);
39
30
 
@@ -42,23 +33,32 @@ describe('MDX frontmatter', () => {
42
33
  expect(layoutParagraph).to.not.be.null;
43
34
  });
44
35
 
45
- it('passes frontmatter to layout via "content" prop', async () => {
46
- const fixture = await loadFixture({
47
- root: FIXTURE_ROOT,
48
- integrations: [mdx()],
49
- });
50
- await fixture.build();
51
-
36
+ it('passes frontmatter to layout via "content" and "frontmatter" props', async () => {
52
37
  const html = await fixture.readFile('/index.html');
53
38
  const { document } = parseHTML(html);
54
39
 
55
- const h1 = document.querySelector('h1');
40
+ const contentTitle = document.querySelector('[data-content-title]');
41
+ const frontmatterTitle = document.querySelector('[data-frontmatter-title]');
42
+
43
+ expect(contentTitle.textContent).to.equal('Using YAML frontmatter');
44
+ expect(frontmatterTitle.textContent).to.equal('Using YAML frontmatter');
45
+ });
46
+
47
+ it('passes headings to layout via "headings" prop', async () => {
48
+ const html = await fixture.readFile('/with-headings/index.html');
49
+ const { document } = parseHTML(html);
50
+
51
+ const headingSlugs = [...document.querySelectorAll('[data-headings] > li')].map(
52
+ (el) => el.textContent
53
+ );
56
54
 
57
- expect(h1.textContent).to.equal('Using YAML frontmatter');
55
+ expect(headingSlugs.length).to.be.greaterThan(0);
56
+ expect(headingSlugs).to.contain('section-1');
57
+ expect(headingSlugs).to.contain('section-2');
58
58
  });
59
59
 
60
60
  it('extracts frontmatter to "customFrontmatter" export when configured', async () => {
61
- const fixture = await loadFixture({
61
+ const customFixture = await loadFixture({
62
62
  root: new URL('./fixtures/mdx-custom-frontmatter-name/', import.meta.url),
63
63
  integrations: [
64
64
  mdx({
@@ -68,9 +68,9 @@ describe('MDX frontmatter', () => {
68
68
  }),
69
69
  ],
70
70
  });
71
- await fixture.build();
71
+ await customFixture.build();
72
72
 
73
- const { titles } = JSON.parse(await fixture.readFile('/glob.json'));
73
+ const { titles } = JSON.parse(await customFixture.readFile('/glob.json'));
74
74
  expect(titles).to.include('Using YAML frontmatter');
75
75
  });
76
76
  });