image-process icon indicating copy to clipboard operation
image-process copied to clipboard

missing urlencode in `build_srcset()` to handle image filenames that contains whitespaces?

Open ungual opened this issue 2 years ago • 2 comments

I've recently had a problem using the plugin with image files that have whitespaces in their name. This gives no problem on the src attribute as it has no separator. However for responsive-images, the srcset attribute uses whitespaces as separator between filename and the width/pixel-density descriptor, hence images filename with whitespaces in them breaking the property parsing of the browser.

I was able to fix it by modifying the build_srcset() function. I added a urlencoding to the filename using urllib.parse.quote(), as such

for src in process["srcset"]:
        file_path = posixpath.join(path.base_url, src[0], urllib.parse.quote(path.filename))
        srcset.append("%s %s" % (file_path, src[0]))
        destination = os.path.join(path.base_path, src[0], path.filename)
        process_image((path.source, destination, src[1]), settings)

should this become a feature, and if yes it probably need to be done for the whole path including parents folder, and with a little more care than this quick edit.

ungual avatar Sep 19 '23 07:09 ungual

If I understand this correctly, you're turning the space in the filename into %20, and then everything is happy?

minchinweb avatar Sep 19 '23 18:09 minchinweb

yes exactly! however urlencoding the original images src doesn't work because image_process rewrite it anyways, so this step has to be done in the plugin itself as far as i understand

ungual avatar Sep 19 '23 18:09 ungual