2024-02-13 08:23:07 -05:00
|
|
|
import assert from 'node:assert/strict';
|
|
|
|
import { after, before, describe, it } from 'node:test';
|
2024-02-21 09:08:19 -05:00
|
|
|
import * as cheerio from 'cheerio';
|
2023-05-02 02:42:48 -05:00
|
|
|
import { loadFixture } from './test-utils.js';
|
|
|
|
|
|
|
|
describe('Image', () => {
|
|
|
|
/** @type {import('../../../astro/test/test-utils.js').Fixture} */
|
|
|
|
let fixture;
|
|
|
|
|
|
|
|
before(async () => {
|
|
|
|
fixture = await loadFixture({
|
|
|
|
root: './fixtures/image/',
|
|
|
|
});
|
|
|
|
await fixture.build();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('build successful', async () => {
|
2024-02-13 08:23:07 -05:00
|
|
|
assert.ok(await fixture.readFile('../.vercel/output/static/index.html'));
|
2023-05-02 02:42:48 -05:00
|
|
|
});
|
|
|
|
|
|
|
|
it('has link to vercel in build with proper attributes', async () => {
|
|
|
|
const html = await fixture.readFile('../.vercel/output/static/index.html');
|
|
|
|
const $ = cheerio.load(html);
|
2023-09-13 11:40:02 -05:00
|
|
|
const img = $('#basic-image img');
|
2023-05-02 02:42:48 -05:00
|
|
|
|
2024-02-13 08:23:07 -05:00
|
|
|
assert.equal(img.attr('src').startsWith('/_vercel/image?url=_astr'), true);
|
|
|
|
assert.equal(img.attr('loading'), 'lazy');
|
|
|
|
assert.equal(img.attr('width'), '225');
|
2023-05-02 02:42:48 -05:00
|
|
|
});
|
|
|
|
|
|
|
|
it('has proper vercel config', async () => {
|
|
|
|
const vercelConfig = JSON.parse(await fixture.readFile('../.vercel/output/config.json'));
|
|
|
|
|
2024-02-13 08:23:07 -05:00
|
|
|
assert.deepEqual(vercelConfig.images, {
|
2023-05-02 02:42:48 -05:00
|
|
|
sizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
|
2023-09-07 11:12:00 -05:00
|
|
|
domains: ['astro.build'],
|
|
|
|
remotePatterns: [
|
|
|
|
{
|
|
|
|
protocol: 'https',
|
|
|
|
hostname: '**.amazonaws.com',
|
|
|
|
},
|
|
|
|
],
|
2023-05-02 02:42:48 -05:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('dev', () => {
|
|
|
|
let devServer;
|
|
|
|
|
|
|
|
before(async () => {
|
|
|
|
devServer = await fixture.startDevServer();
|
|
|
|
});
|
|
|
|
|
|
|
|
after(async () => {
|
|
|
|
await devServer.stop();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('has link to local image in dev with proper attributes', async () => {
|
|
|
|
const html = await fixture.fetch('/').then((res) => res.text());
|
|
|
|
const $ = cheerio.load(html);
|
2023-09-13 11:40:02 -05:00
|
|
|
const img = $('#basic-image img');
|
2023-05-02 02:42:48 -05:00
|
|
|
|
2024-02-13 08:23:07 -05:00
|
|
|
assert.equal(img.attr('src').startsWith('/_image?href='), true);
|
|
|
|
assert.equal(img.attr('loading'), 'lazy');
|
|
|
|
assert.equal(img.attr('width'), '225');
|
2023-05-02 02:42:48 -05:00
|
|
|
});
|
2023-09-13 11:40:02 -05:00
|
|
|
|
|
|
|
it('supports SVGs', async () => {
|
|
|
|
const html = await fixture.fetch('/').then((res) => res.text());
|
|
|
|
const $ = cheerio.load(html);
|
|
|
|
const img = $('#svg img');
|
|
|
|
const src = img.attr('src');
|
|
|
|
|
|
|
|
const res = await fixture.fetch(src);
|
2024-02-13 08:23:07 -05:00
|
|
|
assert.equal(res.status, 200);
|
|
|
|
assert.equal(res.headers.get('content-type'), 'image/svg+xml');
|
2023-09-13 11:40:02 -05:00
|
|
|
});
|
2023-05-02 02:42:48 -05:00
|
|
|
});
|
|
|
|
});
|