diff options
author | 2021-03-31 13:04:18 -0600 | |
---|---|---|
committer | 2021-03-31 13:04:18 -0600 | |
commit | 3fa6396a7b092258c994d0bee6719b89b45c7bf8 (patch) | |
tree | 0e0c1b842831bae8d4bfc4b643ebb6f4f7d13f7f /test | |
parent | a3b20a9affaee976c3e1f3019016fb096b1516fb (diff) | |
download | astro-3fa6396a7b092258c994d0bee6719b89b45c7bf8.tar.gz astro-3fa6396a7b092258c994d0bee6719b89b45c7bf8.tar.zst astro-3fa6396a7b092258c994d0bee6719b89b45c7bf8.zip |
Extract Astro styles to external stylesheets (#43)
* Extract Astro styles to external stylesheets
* Require relative URLs in Markdown layouts
Diffstat (limited to 'test')
-rw-r--r-- | test/astro-styles-ssr.test.js | 25 | ||||
-rw-r--r-- | test/fixtures/astro-markdown/astro/pages/post.md | 4 |
2 files changed, 21 insertions, 8 deletions
diff --git a/test/astro-styles-ssr.test.js b/test/astro-styles-ssr.test.js index 9ee67f69b..2342fcda4 100644 --- a/test/astro-styles-ssr.test.js +++ b/test/astro-styles-ssr.test.js @@ -8,6 +8,16 @@ const StylesSSR = suite('Styles SSR'); let runtime; +/** Basic CSS minification; removes some flakiness in testing CSS */ +function cssMinify(css) { + return css + .trim() // remove whitespace + .replace(/\n\s*/g, '') // collapse lines + .replace(/\s*\{/g, '{') // collapse selectors + .replace(/:\s*/g, ':') // collapse attributes + .replace(/;}/g, '}'); // collapse block +} + StylesSSR.before(async () => { const astroConfig = await loadConfig(new URL('./fixtures/astro-styles-ssr', import.meta.url).pathname); @@ -54,12 +64,15 @@ StylesSSR('CSS Module support in .astro', async () => { let scopedClass; // test 1: <style> tag in <head> is transformed - const css = $('style') - .html() - .replace(/\.astro-[A-Za-z0-9-]+/, (match) => { - scopedClass = match; - return match; - }); // remove class hash (should be deterministic / the same every time, but even still don‘t cause this test to flake) + const css = cssMinify( + $('style') + .html() + .replace(/\.astro-[A-Za-z0-9-]+/, (match) => { + scopedClass = match; // get class hash from result + return match; + }) + ); + assert.equal(css, `.wrapper${scopedClass}{margin-left:auto;margin-right:auto;max-width:1200px}`); // test 2: element received .astro-XXXXXX class (this selector will succeed if transformed correctly) diff --git a/test/fixtures/astro-markdown/astro/pages/post.md b/test/fixtures/astro-markdown/astro/pages/post.md index 3a97cf4ec..58ebdc945 100644 --- a/test/fixtures/astro-markdown/astro/pages/post.md +++ b/test/fixtures/astro-markdown/astro/pages/post.md @@ -1,5 +1,5 @@ --- -layout: layouts/content.astro +layout: ../layouts/content.astro title: My Blog Post description: This is a post about some stuff. import: @@ -10,4 +10,4 @@ import: <div id="first">Some content</div> -<Example />
\ No newline at end of file +<Example /> |