Problem/Motivation
Whenever possible, responsive images should be built with srcset rather than the <picture> tag (more). Also,
Stage File Proxy →
,
S3 File System →
, and the
Flysystem suite of modules →
are common solutions to file storage. Unfortunately, when relying on proxied services for image files that are being rendered through an image style that will output a srcset image tag, an exception is thrown that breaks the entire page.
Steps to reproduce
- Install Drupal with the Responsive Images (core) module.
- Create a responsive image style that will output a
srcset image tag using this technique. The image styles used within the responsive image style should scale only by one dimension.
- Create a content type with an image field.
- Set that image field's formatter to be a "responsive image" using the style created in Step 2.
- Create a piece of content and upload an image that will use that formatter.
- Download and enable the
Stage File Proxy →
contrib module (or any other module that uses a proxied service for storing images) and configure it to point to another origin if a file in the file system does not exist.
- Move the image file from Step 5 outside of the current environment's file system, and into the place where the SFP origin points to, in such a way that when using SFP as designed, it would find and download this image file when it realized the current environment's file system didn't yet have it.
- Navigate to the node page that should output the image using the responsive image formatter.
Expected result: Upon realizing the file isn't in the current environment's file system, Stage File Proxy should grab it from the origin (assuming it exists there) and should be able to use it when rendering the responsive image.
Actual result: An exception is thrown that breaks the entire page:
LogicException: Could not determine image width for 'public://image-name.jpg' using image style with ID: responsive_image_style. This image style can not be used for a responsive image style mapping using the 'sizes' attribute. in responsive_image_build_source_attributes() (line 391 of core/modules/responsive_image/responsive_image.module).
Notes: This error is not thrown when the responsive image style is configured to output a <picture> element. SFP will work as designed and the page/image will be displayed as expected.
Proposed resolution
Unfortunately, I don't know. Looking for guidance here from those more familiar with this functionality...
I assume that a bug that so heavily relies on a contrib module would normally be that module's problem, but this doesn't quite seem to be the case because the exception never gives SFP a chance to fetch the image. I suppose I could have framed it this way: if the image doesn't exist in the file system, an exception is thrown that breaks the whole page, but I would expect only a broken <img> tag on an otherwise OK page. I didn't because that seems more like a "fix your image" problem than a "developers are going to rely on this to work without issue and it won't" problem.
Remaining tasks
TBD
User interface changes
N/A
API changes
N/A
Data model changes
N/A