summaryrefslogtreecommitdiff
path: root/packages/integrations/image/test/image-ssr-build.test.js
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--packages/integrations/image/test/image-ssr-build.test.js334
1 files changed, 106 insertions, 228 deletions
diff --git a/packages/integrations/image/test/image-ssr-build.test.js b/packages/integrations/image/test/image-ssr-build.test.js
index 796843d8b..333b13f7b 100644
--- a/packages/integrations/image/test/image-ssr-build.test.js
+++ b/packages/integrations/image/test/image-ssr-build.test.js
@@ -3,7 +3,7 @@ import * as cheerio from 'cheerio';
import { loadFixture } from './test-utils.js';
import testAdapter from '../../../astro/test/test-adapter.js';
-describe('SSR images - build', function () {
+describe('SSR images - build', async function () {
let fixture;
before(async () => {
@@ -14,113 +14,50 @@ describe('SSR images - build', function () {
});
await fixture.build();
});
-
- describe('Local images', () => {
- it('includes src, width, and height attributes', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#social-jpg');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('jpg');
- expect(searchParams.get('w')).to.equal('506');
- expect(searchParams.get('h')).to.equal('253');
- // TODO: possible to avoid encoding the full image path?
- expect(searchParams.get('href')).to.equal('/assets/social.cece8c77.jpg');
- });
- });
-
- describe('Inline imports', () => {
- it('includes src, width, and height attributes', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#inline');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('jpg');
- expect(searchParams.get('w')).to.equal('506');
- expect(searchParams.get('h')).to.equal('253');
- // TODO: possible to avoid encoding the full image path?
- expect(searchParams.get('href')).to.equal('/assets/social.cece8c77.jpg');
- });
- });
-
- describe('Remote images', () => {
- it('includes src, width, and height attributes', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#google');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('webp');
- expect(searchParams.get('w')).to.equal('544');
- expect(searchParams.get('h')).to.equal('184');
- expect(searchParams.get('href')).to.equal(
- 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'
- );
- });
-
- it('keeps remote image query params', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#query');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('webp');
- expect(searchParams.get('w')).to.equal('544');
- expect(searchParams.get('h')).to.equal('184');
- expect(searchParams.get('href')).to.equal(
- 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png?token=abc'
- );
- });
- });
-
- describe('/public images', () => {
- it('includes src, width, and height attributes', async () => {
+
+ [
+ {
+ title: 'Local images',
+ id: '#social-jpg',
+ url: '/_image',
+ query: { f: 'jpg', w: '506', h: '253', href: /^\/assets\/social.\w{8}.jpg/ }
+ },
+ {
+ title: 'Inline imports',
+ id: '#inline',
+ url: '/_image',
+ query: { f: 'jpg', w: '506', h: '253', href: /^\/assets\/social.\w{8}.jpg/ }
+ },
+ {
+ title: 'Remote images',
+ id: '#google',
+ url: '/_image',
+ query: {
+ f: 'webp',
+ w: '544',
+ h: '184',
+ href: 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'
+ }
+ },
+ {
+ title: 'Remote images with search',
+ id: '#query',
+ url: '/_image',
+ query: {
+ f: 'webp',
+ w: '544',
+ h: '184',
+ href: 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png?token=abc'
+ }
+ },
+ {
+ title: 'Public images',
+ id: '#hero',
+ url: '/_image',
+ query: { f: 'webp', w: '768', h: '414', href: '/hero.jpg' }
+ }
+ ].forEach(({ title, id, url, query }) => {
+ it(title, async () => {
const app = await fixture.loadTestAdapterApp();
const request = new Request('http://example.com/');
@@ -128,20 +65,22 @@ describe('SSR images - build', function () {
const html = await response.text();
const $ = cheerio.load(html);
- const image = $('#hero');
+ const image = $(id);
const src = image.attr('src');
const [route, params] = src.split('?');
- expect(route).to.equal('/_image');
+ expect(route).to.equal(url);
const searchParams = new URLSearchParams(params);
- expect(searchParams.get('f')).to.equal('webp');
- expect(searchParams.get('w')).to.equal('768');
- expect(searchParams.get('h')).to.equal('414');
- // TODO: possible to avoid encoding the full image path?
- expect(searchParams.get('href')).to.equal('/hero.jpg');
+ for (const [key, value] of Object.entries(query)) {
+ if (typeof value === 'string') {
+ expect(searchParams.get(key)).to.equal(value);
+ } else {
+ expect(searchParams.get(key)).to.match(value);
+ }
+ }
});
});
});
@@ -159,112 +98,49 @@ describe('SSR images with subpath - build', function () {
await fixture.build();
});
- describe('Local images', () => {
- it('includes src, width, and height attributes', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#social-jpg');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('jpg');
- expect(searchParams.get('w')).to.equal('506');
- expect(searchParams.get('h')).to.equal('253');
- // TODO: possible to avoid encoding the full image path?
- expect(searchParams.get('href')).to.equal('/docs/assets/social.cece8c77.jpg');
- });
- });
-
- describe('Inline imports', () => {
- it('includes src, width, and height attributes', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#inline');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('jpg');
- expect(searchParams.get('w')).to.equal('506');
- expect(searchParams.get('h')).to.equal('253');
- // TODO: possible to avoid encoding the full image path?
- expect(searchParams.get('href')).to.equal('/docs/assets/social.cece8c77.jpg');
- });
- });
-
- describe('Remote images', () => {
- it('includes src, width, and height attributes', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#google');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('webp');
- expect(searchParams.get('w')).to.equal('544');
- expect(searchParams.get('h')).to.equal('184');
- expect(searchParams.get('href')).to.equal(
- 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'
- );
- });
-
- it('keeps remote image query params', async () => {
- const app = await fixture.loadTestAdapterApp();
-
- const request = new Request('http://example.com/');
- const response = await app.render(request);
- const html = await response.text();
- const $ = cheerio.load(html);
-
- const image = $('#query');
-
- const src = image.attr('src');
- const [route, params] = src.split('?');
-
- expect(route).to.equal('/_image');
-
- const searchParams = new URLSearchParams(params);
-
- expect(searchParams.get('f')).to.equal('webp');
- expect(searchParams.get('w')).to.equal('544');
- expect(searchParams.get('h')).to.equal('184');
- expect(searchParams.get('href')).to.equal(
- 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png?token=abc'
- );
- });
- });
-
- describe('/public images', () => {
- it('includes src, width, and height attributes', async () => {
+ [
+ {
+ title: 'Local images',
+ id: '#social-jpg',
+ url: '/_image',
+ query: { f: 'jpg', w: '506', h: '253', href: /^\/docs\/assets\/social.\w{8}.jpg/ }
+ },
+ {
+ title: 'Inline imports',
+ id: '#inline',
+ url: '/_image',
+ query: { f: 'jpg', w: '506', h: '253', href: /^\/docs\/assets\/social.\w{8}.jpg/ }
+ },
+ {
+ title: 'Remote images',
+ id: '#google',
+ url: '/_image',
+ query: {
+ f: 'webp',
+ w: '544',
+ h: '184',
+ href: 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'
+ }
+ },
+ {
+ title: 'Remote images with search',
+ id: '#query',
+ url: '/_image',
+ query: {
+ f: 'webp',
+ w: '544',
+ h: '184',
+ href: 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png?token=abc'
+ }
+ },
+ {
+ title: 'Public images',
+ id: '#hero',
+ url: '/_image',
+ query: { f: 'webp', w: '768', h: '414', href: '/hero.jpg' }
+ }
+ ].forEach(({ title, id, url, query }) => {
+ it(title, async () => {
const app = await fixture.loadTestAdapterApp();
const request = new Request('http://example.com/');
@@ -272,20 +148,22 @@ describe('SSR images with subpath - build', function () {
const html = await response.text();
const $ = cheerio.load(html);
- const image = $('#hero');
+ const image = $(id);
const src = image.attr('src');
const [route, params] = src.split('?');
- expect(route).to.equal('/_image');
+ expect(route).to.equal(url);
const searchParams = new URLSearchParams(params);
- expect(searchParams.get('f')).to.equal('webp');
- expect(searchParams.get('w')).to.equal('768');
- expect(searchParams.get('h')).to.equal('414');
- // TODO: possible to avoid encoding the full image path?
- expect(searchParams.get('href')).to.equal('/hero.jpg');
+ for (const [key, value] of Object.entries(query)) {
+ if (typeof value === 'string') {
+ expect(searchParams.get(key)).to.equal(value);
+ } else {
+ expect(searchParams.get(key)).to.match(value);
+ }
+ }
});
});
});
generated by cgit v1.2.3 (git 2.46.0) at 2025-08-19 02:27:59 +0000