diff options
| -rw-r--r-- | .changeset/hot-camels-move.md | 5 | ||||
| -rw-r--r-- | packages/astro/src/assets/services/service.ts | 5 | ||||
| -rw-r--r-- | packages/astro/src/core/config/schema.ts | 5 | ||||
| -rw-r--r-- | packages/astro/test/core-image.test.js | 49 |
4 files changed, 61 insertions, 3 deletions
diff --git a/.changeset/hot-camels-move.md b/.changeset/hot-camels-move.md new file mode 100644 index 000000000..2598e7540 --- /dev/null +++ b/.changeset/hot-camels-move.md @@ -0,0 +1,5 @@ +--- +'astro': patch +--- + +Properly handle including trailing slash on the image endpoint route based on the trailingSlash config diff --git a/packages/astro/src/assets/services/service.ts b/packages/astro/src/assets/services/service.ts index e22bada89..4662963dc 100644 --- a/packages/astro/src/assets/services/service.ts +++ b/packages/astro/src/assets/services/service.ts @@ -343,7 +343,10 @@ export const baseService: Omit<LocalImageService, 'transform'> = { options[key] && searchParams.append(param, options[key].toString()); }); - const imageEndpoint = joinPaths(import.meta.env.BASE_URL, imageConfig.endpoint.route); + const imageEndpoint = joinPaths( + import.meta.env.BASE_URL, + imageConfig.endpoint.route + ); return `${imageEndpoint}?${searchParams}`; }, parseURL(url) { diff --git a/packages/astro/src/core/config/schema.ts b/packages/astro/src/core/config/schema.ts index 02f96fe0d..1c80f6abe 100644 --- a/packages/astro/src/core/config/schema.ts +++ b/packages/astro/src/core/config/schema.ts @@ -657,13 +657,16 @@ export function createRelativeSchema(cmd: string, fileProtocolRoot: string) { config.build.server = resolveDirAsUrl(originalBuildServer, outDirPath); } - // Handle `base` trailing slash based on `trailingSlash` config + // Handle `base` and `image.endpoint.route` trailing slash based on `trailingSlash` config if (config.trailingSlash === 'never') { config.base = prependForwardSlash(removeTrailingForwardSlash(config.base)); + config.image.endpoint.route = prependForwardSlash(removeTrailingForwardSlash(config.image.endpoint.route)); } else if (config.trailingSlash === 'always') { config.base = prependForwardSlash(appendForwardSlash(config.base)); + config.image.endpoint.route = prependForwardSlash(appendForwardSlash(config.image.endpoint.route)); } else { config.base = prependForwardSlash(config.base); + config.image.endpoint.route = prependForwardSlash(config.image.endpoint.route); } return config; diff --git a/packages/astro/test/core-image.test.js b/packages/astro/test/core-image.test.js index c3490a503..379b18b73 100644 --- a/packages/astro/test/core-image.test.js +++ b/packages/astro/test/core-image.test.js @@ -1,7 +1,7 @@ import assert from 'node:assert/strict'; import { basename } from 'node:path'; import { Writable } from 'node:stream'; -import { after, before, describe, it } from 'node:test'; +import { after, afterEach, before, describe, it } from 'node:test'; import { removeDir } from '@astrojs/internal-helpers/fs'; import * as cheerio from 'cheerio'; import parseSrcset from 'parse-srcset'; @@ -1251,4 +1251,51 @@ describe('astro:image', () => { assert.equal(imgData instanceof Buffer, true); }); }); + + describe('trailing slash on the endpoint', () => { + /** @type {import('./test-utils').DevServer} */ + let devServer; + + it('includes a trailing slash if trailing slash is set to always', async () => { + fixture = await loadFixture({ + root: './fixtures/core-image/', + image: { + service: testImageService(), + }, + trailingSlash: 'always', + }); + devServer = await fixture.startDevServer(); + + let res = await fixture.fetch('/'); + let html = await res.text(); + + const $ = cheerio.load(html); + const src = $('#local img').attr('src'); + + assert.equal(src.startsWith('/_image/?'), true); + }) + + it('does not includes a trailing slash if trailing slash is set to never', async () => { + fixture = await loadFixture({ + root: './fixtures/core-image/', + image: { + service: testImageService(), + }, + trailingSlash: 'never', + }); + devServer = await fixture.startDevServer(); + + let res = await fixture.fetch('/'); + let html = await res.text(); + + const $ = cheerio.load(html); + const src = $('#local img').attr('src'); + + assert.equal(src.startsWith('/_image?'), true); + }) + + afterEach(async () => { + await devServer.stop(); + }); + }) }); |