diff options
| -rw-r--r-- | packages/astro/package.json | 1 | ||||
| -rw-r--r-- | packages/astro/src/build.ts | 22 | ||||
| -rw-r--r-- | packages/astro/test/fixtures/astro-assets/src/pages/index.astro | 22 | ||||
| -rw-r--r-- | yarn.lock | 5 |
4 files changed, 45 insertions, 5 deletions
diff --git a/packages/astro/package.json b/packages/astro/package.json index 5325dfd09..950c15e6b 100644 --- a/packages/astro/package.json +++ b/packages/astro/package.json @@ -97,6 +97,7 @@ "shorthash": "^0.0.2", "slash": "^4.0.0", "snowpack": "^3.8.6", + "srcset-parse": "^1.1.0", "string-width": "^5.0.0", "supports-esm": "^1.0.0", "tiny-glob": "^0.2.8", diff --git a/packages/astro/src/build.ts b/packages/astro/src/build.ts index 9222aabcf..ea3b03b77 100644 --- a/packages/astro/src/build.ts +++ b/packages/astro/src/build.ts @@ -8,6 +8,7 @@ import path from 'path'; import { performance } from 'perf_hooks'; import glob from 'tiny-glob'; import hash from 'shorthash'; +import srcsetParse from 'srcset-parse'; import { fileURLToPath } from 'url'; import type { AstroConfig, BuildOutput, BundleMap, PageDependencies, RouteData, RuntimeMode, ScriptInfo } from './@types/astro'; import { bundleCSS } from './build/bundle/css.js'; @@ -20,6 +21,9 @@ import type { LogOptions } from './logger'; import { debug, defaultLogDestination, defaultLogLevel, error, info, warn } from './logger.js'; import { createRuntime, LoadResult } from './runtime.js'; +// This package isn't real ESM, so have to coerce it +const matchSrcset: typeof srcsetParse = (srcsetParse as any).default; + const defaultLogging: LogOptions = { level: defaultLogLevel, dest: defaultLogDestination, @@ -338,11 +342,19 @@ export function findDeps(html: string, { astroConfig, srcPath }: { astroConfig: $('img[srcset]').each((_i, el) => { const srcset = $(el).attr('srcset') || ''; - const sources = srcset.split(','); - const srces = sources.map((s) => s.trim().split(' ')[0]); - for (const src of srces) { - if (!isRemoteOrEmbedded(src)) { - pageDeps.images.add(getDistPath(src, { astroConfig, srcPath })); + for (const src of matchSrcset(srcset)) { + if (!isRemoteOrEmbedded(src.url)) { + pageDeps.images.add(getDistPath(src.url, { astroConfig, srcPath })); + } + } + }); + + // Add in srcset check for <source> + $('source[srcset]').each((_i, el) => { + const srcset = $(el).attr('srcset') || ''; + for (const src of matchSrcset(srcset)) { + if (!isRemoteOrEmbedded(src.url)) { + pageDeps.images.add(getDistPath(src.url, { astroConfig, srcPath })); } } }); diff --git a/packages/astro/test/fixtures/astro-assets/src/pages/index.astro b/packages/astro/test/fixtures/astro-assets/src/pages/index.astro index 4ce1d07ef..79807319d 100644 --- a/packages/astro/test/fixtures/astro-assets/src/pages/index.astro +++ b/packages/astro/test/fixtures/astro-assets/src/pages/index.astro @@ -6,5 +6,27 @@ <body> <h1>Icons</h1> <img src="/_astro/src/images/twitter.png" srcset="/_astro/src/images/twitter.png 1x, /_astro/src/images/twitter@2x.png 2x, /_astro/src/images/twitter@3x.png 3x" /> + <!-- + In Astro (0.20.4 and below) these srcsets will cause a build fail. + Error (for Assets Test) + [build] file:///astro/packages/astro/test/fixtures/astro-assets/src/pages/index.astro: could not find "/_astro/src/pages/h-300/medium_cafe_B1iTdD0C.jpg" + --> + <img srcset="https://ik.imagekit.io/demo/tr:w-300,h-300/medium_cafe_B1iTdD0C.jpg, https://ik.imagekit.io/demo/tr:w-450,h-450/medium_cafe_B1iTdD0C.jpg 600w, https://ik.imagekit.io/demo/tr:w-600,h-600/medium_cafe_B1iTdD0C.jpg 800w"> + <img srcset="https://ik.imagekit.io/demo/tr:w-300,h-300/medium_cafe_B1iTdD0C.jpg, https://ik.imagekit.io/demo/tr:w-450,h-450/medium_cafe_B1iTdD0C.jpg 1.5x, https://ik.imagekit.io/demo/tr:w-600,h-600/medium_cafe_B1iTdD0C.jpg 2x"> + <!-- + A srcset in <source> does not trigger an error in aforementioned versions + as no checking is done for this tag (a good way to circumvent the check.) + --> + <picture> + <!-- + This will cause build fail + [build] file:///astro/packages/astro/test/fixtures/astro-assets/src/pages/index.astro: could not find "/demo/tr:w-300,h-300/medium_cafe_B1iTdD0C.jpg" + --> + <!-- <source srcset="/demo/tr:w-300,h-300/medium_cafe_B1iTdD0C.jpg, /demo/tr:w-450,h-450/medium_cafe_B1iTdD0C.jpg 600w, /demo/tr:w-600,h-600/medium_cafe_B1iTdD0C.jpg 800w"> --> + <!-- + This will pass + --> + <source srcset="https://ik.imagekit.io/demo/tr:w-300,h-300/medium_cafe_B1iTdD0C.jpg, https://ik.imagekit.io/demo/tr:w-450,h-450/medium_cafe_B1iTdD0C.jpg 600w, https://ik.imagekit.io/demo/tr:w-600,h-600/medium_cafe_B1iTdD0C.jpg 800w"> + </picture> </body> </html>
\ No newline at end of file @@ -9672,6 +9672,11 @@ sprintf-js@~1.0.2: resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c" integrity sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw= +srcset-parse@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/srcset-parse/-/srcset-parse-1.1.0.tgz#73f787f38b73ede2c5af775e0a3465579488122b" + integrity sha512-JWp4cG2eybkvKA1QUHGoNK6JDEYcOnSuhzNGjZuYUPqXreDl/VkkvP2sZW7Rmh+icuCttrR9ccb2WPIazyM/Cw== + sshpk@^1.7.0: version "1.16.1" resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.16.1.tgz#fb661c0bef29b39db40769ee39fa70093d6f6877" |