diff options
Diffstat (limited to 'packages/integrations/mdx/test/fixtures/css-head-mdx')
33 files changed, 359 insertions, 0 deletions
diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/package.json b/packages/integrations/mdx/test/fixtures/css-head-mdx/package.json new file mode 100644 index 000000000..0abf82349 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/package.json @@ -0,0 +1,10 @@ +{ + "name": "@test/mdx-css-head-mdx", + "version": "0.0.0", + "private": true, + "dependencies": { + "@astrojs/mdx": "workspace:*", + "astro": "workspace:*", + "astro-remote": "0.3.4" + } +} diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/BaseHead.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/BaseHead.astro new file mode 100644 index 000000000..19f517789 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/BaseHead.astro @@ -0,0 +1,11 @@ +--- +const { title } = Astro.props; +--- +<meta charset="UTF-8" /> +<meta name="viewport" content="width=device-width" /> +<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> +<meta name="generator" content={Astro.generator} /> +<title>{title}</title> +<style is:global> + @import "../styles/global.css"; +</style> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/BasicBlock.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/BasicBlock.astro new file mode 100644 index 000000000..95660b6b9 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/BasicBlock.astro @@ -0,0 +1,14 @@ +--- +const { inlineStyle, title, display = 'horizontal' } = Astro.props; +const lineEnding = display === 'horizontal' ? ', ' : '<br>'; +--- + +{title && <h2 set:html={title} />} +<address style={inlineStyle}> + <span class="name">some name</span><Fragment set:html={lineEnding} /> + line 1<Fragment set:html={lineEnding} /> + line 2<Fragment set:html={lineEnding} /> + line 3<Fragment set:html={lineEnding} /> + line 4<Fragment set:html={lineEnding} /> + line 5 +</address> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/GenericComponent.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/GenericComponent.astro new file mode 100644 index 000000000..ebcd3ff35 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/GenericComponent.astro @@ -0,0 +1 @@ +<span>just a generic component</span> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/HelloWorld.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/HelloWorld.astro new file mode 100644 index 000000000..ee8084b46 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/HelloWorld.astro @@ -0,0 +1,11 @@ +---
+---
+
+<h3>Hello world!!</h3>
+<slot />
+
+<style>h3 { color: red }</style>
+
+<script>
+console.log('hellooooo')
+</script>
\ No newline at end of file diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/MDXWrapper.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/MDXWrapper.astro new file mode 100644 index 000000000..fbd530e14 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/MDXWrapper.astro @@ -0,0 +1,9 @@ +--- +import Component from "./GenericComponent.astro"; +--- + +<div> + <slot name="title" /> + <slot name="intro" class="inline" /> + <Component /> +</div> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/P.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/P.astro new file mode 100644 index 000000000..071e08a12 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/P.astro @@ -0,0 +1,3 @@ +<p> + <slot /> +</p> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/SmallCaps.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/SmallCaps.astro new file mode 100644 index 000000000..a0bd6e1f1 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/SmallCaps.astro @@ -0,0 +1,3 @@ +--- +--- +<span style={{fontVariant: "small-caps"}}><slot /></span> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/UsingMdx.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/UsingMdx.astro new file mode 100644 index 000000000..3ef9d7639 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/UsingMdx.astro @@ -0,0 +1,8 @@ +--- +import { getEntry, render } from 'astro:content'; + +const launchWeek = await getEntry('blog', 'using-mdx'); +const { Content } = await render(launchWeek); +--- + +<Content /> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/WithHoistedScripts.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/WithHoistedScripts.astro new file mode 100644 index 000000000..0b8c4445f --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/components/WithHoistedScripts.astro @@ -0,0 +1,6 @@ +--- +--- + +<script> + console.log('hoisted') + </script> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/content/config.ts b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/content/config.ts new file mode 100644 index 000000000..2c8944d51 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/content/config.ts @@ -0,0 +1,18 @@ +import { defineCollection } from "astro:content"; +import { glob } from "astro/loaders" + +const posts = defineCollection({ + loader: glob({ + pattern: "*.mdx", + base: "src/data/posts", + }) +}); + +const blog = defineCollection({ + loader: glob({ + pattern: "*.mdx", + base: "src/data/blog", + }) +}); + +export const collections = { posts, blog }; diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/blog/_styles.css b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/blog/_styles.css new file mode 100644 index 000000000..1379b29c0 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/blog/_styles.css @@ -0,0 +1,3 @@ +body { + color: red !important; +} diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/blog/using-mdx.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/blog/using-mdx.mdx new file mode 100644 index 000000000..917fc3331 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/blog/using-mdx.mdx @@ -0,0 +1,6 @@ +import './_styles.css'; +import WithHoistedScripts from '../../components/WithHoistedScripts.astro'; + +# Using mdx + +<WithHoistedScripts /> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/posts/test.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/posts/test.mdx new file mode 100644 index 000000000..0bb1153ca --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/posts/test.mdx @@ -0,0 +1,5 @@ +--- +title: Testing +--- + +<SmallCaps>A test file</SmallCaps> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/posts/using-component.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/posts/using-component.mdx new file mode 100644 index 000000000..fa550fb04 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/data/posts/using-component.mdx @@ -0,0 +1,13 @@ +--- +title: testing +--- +import MDXWrapper from "../../components/MDXWrapper.astro"; + +<MDXWrapper> + <h1 slot="title"> + testing + </h1> + <div slot="intro"> + Intro + </div> +</MDXWrapper> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/ContentLayout.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/ContentLayout.astro new file mode 100644 index 000000000..1e4b6a6f8 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/ContentLayout.astro @@ -0,0 +1,18 @@ +--- +import BaseHead from "../components/BaseHead.astro"; +interface Props { + title: string; +} + +const { title } = Astro.props; +--- + +<!DOCTYPE html> +<html lang="en"> + <head> + <BaseHead title={title} /> + </head> + <body> + <slot /> + </body> +</html> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/DocumentLayout.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/DocumentLayout.astro new file mode 100644 index 000000000..a09a1c218 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/DocumentLayout.astro @@ -0,0 +1,15 @@ +--- +// Extend the BaseLayout, adding space for a banner at the top of the page +// after the main heading, then the detail for the actual page +import ContentLayout from './ContentLayout.astro'; +const { frontmatter } = Astro.props; +--- + +<ContentLayout> + <div class="content-container"> + <article id="main-content" class="pad-z5 flow"> + <h1 set:html={frontmatter.pageHeading ? frontmatter.pageHeading : frontmatter.title} /> + <slot /> + </article> + </div> +</ContentLayout> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/One.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/One.astro new file mode 100644 index 000000000..b9916e106 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/One.astro @@ -0,0 +1,15 @@ +---
+---
+
+<html lang="en">
+ <head>
+ <meta charset="utf-8" />
+ <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+ <meta name="viewport" content="width=device-width" />
+ <meta name="generator" content={Astro.generator} />
+ <title>Astro</title>
+ </head>
+ <body>
+ <slot />
+ </body>
+</html>
\ No newline at end of file diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/Three.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/Three.astro new file mode 100644 index 000000000..3f0fdfa72 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/Three.astro @@ -0,0 +1,6 @@ +---
+import Two from './Two.astro'
+---
+<Two>
+<slot />
+</Two>
\ No newline at end of file diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/Two.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/Two.astro new file mode 100644 index 000000000..51f0ca18c --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/layouts/Two.astro @@ -0,0 +1,6 @@ +---
+import One from './One.astro'
+---
+<One>
+<slot />
+</One>
\ No newline at end of file diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/DirectContentUsage.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/DirectContentUsage.astro new file mode 100644 index 000000000..cbf4295a7 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/DirectContentUsage.astro @@ -0,0 +1,17 @@ +--- +import UsingMdx from '../components/UsingMdx.astro' +--- + +<html lang="en"> + <head> + <meta charset="utf-8" /> + <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> + <meta name="viewport" content="width=device-width" /> + <meta name="generator" content={Astro.generator} /> + <title>Astro</title> + </head> + <body> + <h1>Astro</h1> + <UsingMdx /> + </body> +</html> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/componentwithtext.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/componentwithtext.mdx new file mode 100644 index 000000000..2c6f3032f --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/componentwithtext.mdx @@ -0,0 +1,12 @@ +--- +layout: ../layouts/DocumentLayout.astro +title: blah blah +--- + +import BasicBlock from '../components/BasicBlock.astro'; + +Some text for a paragraph. + +<BasicBlock title="This causes css in wrong place." /> + +Some other text. diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexOne.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexOne.astro new file mode 100644 index 000000000..f24bf4f3c --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexOne.astro @@ -0,0 +1,10 @@ +--- +import One from '../layouts/One.astro' + +import { Content } from '../test.mdx' +--- + +<One> + <h1>Astro</h1> + <Content /> +</One> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexThree.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexThree.astro new file mode 100644 index 000000000..99be9677c --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexThree.astro @@ -0,0 +1,10 @@ +---
+import Three from '../layouts/Three.astro'
+
+import { Content } from '../test.mdx'
+---
+
+<Three>
+ <h1>Astro</h1>
+ <Content />
+</Three>
diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexTwo.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexTwo.astro new file mode 100644 index 000000000..af07af926 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/indexTwo.astro @@ -0,0 +1,10 @@ +---
+import Two from '../layouts/Two.astro'
+
+import { Content } from '../test.mdx'
+---
+
+<Two>
+ <h1>Astro</h1>
+ <Content />
+</Two>
diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/noLayoutWithComponent.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/noLayoutWithComponent.mdx new file mode 100644 index 000000000..9d799d4db --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/noLayoutWithComponent.mdx @@ -0,0 +1,22 @@ +--- +title: 'Lorem' +description: 'Lorem ipsum dolor sit amet' +pubDate: 'Jul 02 2022' +--- + +import MyComponent from '../components/HelloWorld.astro'; + + +## Lorem + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. + +## Lorem 2 + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. + +<MyComponent /> + +## Lorem 3 + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/posts/[post].astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/posts/[post].astro new file mode 100644 index 000000000..13a9e56db --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/posts/[post].astro @@ -0,0 +1,18 @@ +--- +import { getCollection, render } from 'astro:content'; +import SmallCaps from '../../components/SmallCaps.astro'; +import Layout from '../../layouts/ContentLayout.astro'; + +export async function getStaticPaths() { + const entries = await getCollection('posts'); + return entries.map(entry => { + return { params: { post: entry.id }, props: { entry }}; + }); +} + +const { entry } = Astro.props; +const { Content } = await render(entry); +--- +<Layout title=""> + <Content components={{ SmallCaps }} /> +</Layout> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/remote.astro b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/remote.astro new file mode 100644 index 000000000..7c8000642 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/remote.astro @@ -0,0 +1,17 @@ +--- +import { Markdown } from 'astro-remote' +import Paragraph from '../components/P.astro'; +import Layout from '../layouts/One.astro'; +import '../styles/global.css' +--- + +<Layout title="Welcome to Astro."> + <main> + <Markdown + components={{ + p: Paragraph, + }}> + **Removing p component fixes the problem** + </Markdown> + </main> +</Layout> diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testOne.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testOne.mdx new file mode 100644 index 000000000..6874b499f --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testOne.mdx @@ -0,0 +1,15 @@ +---
+layout: '../layouts/One.astro'
+title: "hello world"
+publishDate: "2023-01-01"
+---
+
+import HelloWorld from '../components/HelloWorld.astro';
+
+# Test
+
+123
+
+<HelloWorld />
+
+456
diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testThree.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testThree.mdx new file mode 100644 index 000000000..b0e55eed2 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testThree.mdx @@ -0,0 +1,15 @@ +---
+layout: '../layouts/Three.astro'
+title: "hello world"
+publishDate: "2023-01-01"
+---
+
+import HelloWorld from '../components/HelloWorld.astro';
+
+# Test
+
+123
+
+<HelloWorld />
+
+456
diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testTwo.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testTwo.mdx new file mode 100644 index 000000000..9a80ed5f0 --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/pages/testTwo.mdx @@ -0,0 +1,15 @@ +---
+layout: '../layouts/Two.astro'
+title: "hello world"
+publishDate: "2023-01-01"
+---
+
+import HelloWorld from '../components/HelloWorld.astro';
+
+# Test
+
+123
+
+<HelloWorld />
+
+456
diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/styles/global.css b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/styles/global.css new file mode 100644 index 000000000..e1450526f --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/styles/global.css @@ -0,0 +1,3 @@ +html { + font-weight: bolder; +} diff --git a/packages/integrations/mdx/test/fixtures/css-head-mdx/src/test.mdx b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/test.mdx new file mode 100644 index 000000000..c8ecc4daa --- /dev/null +++ b/packages/integrations/mdx/test/fixtures/css-head-mdx/src/test.mdx @@ -0,0 +1,14 @@ +---
+title: "hello world"
+publishDate: "2023-01-01"
+---
+
+import HelloWorld from './components/HelloWorld.astro';
+
+# Test
+
+123
+
+<HelloWorld />
+
+456
|