astro/packages/astro/test/astro-partial-html.test.js
Nate Moore 025743849d
Fix duplicate CSS in dev mode (#4157)
* fix(hmr): remove SSR styles once HMR styles are injected

* refactor: remove data-astro-injected tag

* chore: add changeset

Co-authored-by: Nate Moore <nate@astro.build>
2022-08-05 13:36:03 -05:00

49 lines
1.4 KiB
JavaScript

import { expect } from 'chai';
import * as cheerio from 'cheerio';
import { loadFixture } from './test-utils.js';
describe('Partial HTML', async () => {
let fixture;
let devServer;
before(async () => {
fixture = await loadFixture({
root: './fixtures/astro-partial-html/',
});
devServer = await fixture.startDevServer();
});
after(async () => {
await devServer.stop();
});
it('injects Astro styles and scripts', async () => {
const html = await fixture.fetch('/astro').then((res) => res.text());
const $ = cheerio.load(html);
// test 1: Doctype first
expect(html).to.match(/^<!DOCTYPE html/);
// test 2: correct CSS present
const allInjectedStyles = $('style').text();
expect(allInjectedStyles).to.match(/\:where\(\.astro-[^{]+{color:red}/);
});
it('injects framework styles', async () => {
const html = await fixture.fetch('/jsx').then((res) => res.text());
const $ = cheerio.load(html);
// test 1: Doctype first
expect(html).to.match(/^<!DOCTYPE html/);
// test 2: link tag present
const allInjectedStyles = $('style').text().replace(/\s*/g, '');
expect(allInjectedStyles).to.match(/h1{color:red;}/);
});
it('pages with a head, injection happens inside', async () => {
const html = await fixture.fetch('/with-head').then((res) => res.text());
const $ = cheerio.load(html);
expect($('style')).to.have.lengthOf(1);
});
});