michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add SSR Styles test (#35)

Browse source
This commit is contained in:
Drew Powers 2021-03-26 13:59:41 -06:00 committed by GitHub
parent b92b9f66e5
commit 88df57e690
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 100 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
test/astro-styles-ssr.test.js Normal file
View file

@ -0,0 +1,50 @@
import { suite } from 'uvu';
import * as assert from 'uvu/assert';
import { createRuntime } from '../lib/runtime.js';
import { loadConfig } from '../lib/config.js';
import { doc } from './test-utils.js';
const StylesSSR = suite('Styles SSR');
let runtime;
StylesSSR.before(async () => {
const astroConfig = await loadConfig(new URL('./fixtures/astro-styles-ssr', import.meta.url).pathname);
const logging = {
level: 'error',
dest: process.stderr,
};
runtime = await createRuntime(astroConfig, logging);
});
StylesSSR.after(async () => {
(await runtime) && runtime.shutdown();
});
StylesSSR('Has <link> tags', async () => {
const MUST_HAVE_LINK_TAGS = ['/_astro/components/SvelteScoped.svelte.css', '/_astro/components/VueCSS.vue.css', '/_astro/components/ReactCSS.css'];
const result = await runtime.load('/');
const $ = doc(result.contents);
for (const href of MUST_HAVE_LINK_TAGS) {
const el = $(`link[href="${href}"]`);
assert.equal(el.length, 1);
}
});
StylesSSR('Has correct CSS classes', async () => {
const MUST_HAVE_CSS_CLASSES = ['react-title', 'vue-title', 'svelte-title'];
const result = await runtime.load('/');
const $ = doc(result.contents);
for (const className of MUST_HAVE_CSS_CLASSES) {
const el = $(`.${className}`);
assert.equal(el.length, 1);
}
});
StylesSSR.run();

6
test/fixtures/astro-styles-ssr/astro.config.mjs vendored Normal file
View file

@ -0,0 +1,6 @@
export default {
projectRoot: '.',
astroRoot: './astro',
dist: './_site',
// No extensions needed, React is the default.
};

3
test/fixtures/astro-styles-ssr/astro/components/ReactCSS.css vendored Normal file
View file

@ -0,0 +1,3 @@
.react-title {
font-family: fantasy;
}

7
test/fixtures/astro-styles-ssr/astro/components/ReactCSS.jsx vendored Normal file
View file

@ -0,0 +1,7 @@
import React from 'react';
import './ReactCSS.css';
function ReactCSS() {
return <h1 className="react-title">React CSS</h1>;
}
export default ReactCSS;

7
test/fixtures/astro-styles-ssr/astro/components/SvelteScoped.svelte vendored Normal file
View file

@ -0,0 +1,7 @@
<h1 class="svelte-title">Svelte Scoped</h1>
<style>
.svelte-title {
font-family: 'Comic Sans MS', sans-serif;
}
</style>

9
test/fixtures/astro-styles-ssr/astro/components/VueCSS.vue vendored Normal file
View file

@ -0,0 +1,9 @@
<style>
.vue-title {
font-family: cursive;
}
</style>
<template>
<h1 class="vue-title">Vue CSS</h1>
</template>

18
test/fixtures/astro-styles-ssr/astro/pages/index.astro vendored Normal file
View file

@ -0,0 +1,18 @@
---
import ReactCSS from '../components/ReactCSS.jsx';
import VueCSS from '../components/VueCSS.vue';
import SvelteScoped from '../components/SvelteScoped.svelte';
---
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<div>
<ReactCSS />
<VueCSS />
<SvelteScoped />
</div>
</body>
</html>