PrestaShop/PrestaShop

Prestashop breaks css filter href when building css cache

Open

#33,329 opened on Jul 20, 2023

 (12 comments) (0 reactions) (0 assignees)PHP (4,734 forks)batch import
8.1.xBugFOFront-endHacktoberfestNeeds SpecsQuickwinTrivialVerified

Repository metrics

Stars
 (7,621 stars)
PR merge metrics
 (Avg merge 26d 17h) (116 merged PRs in 30d)

Description

Prerequisites

Describe the bug and add attachments

When we attept to use the filter property to identify a SVG filter in our markup, in the theme css files as in my example below, Prestashop makes the target a relative path breaking the functionality:

#heading {
filter:url("#gooey")
}

When the css cache is built by Prestashop, it converts the above to:

#heading {
filter:url("../css/#gooey")
}

This breaks the css property and our SVG filter is not applied.

Expected behavior

The filter property should remain as defined. Perhaps testing for a hashtag before deciding if relative path should be applied or not.

Steps to reproduce

  1. In a default theme, simply add the following in your theme file:
#heading {
filter:url("#gooey")
}
  1. Ensure CSS Smart cache is enabled in the back office
  2. Clear the cache from the back office
  3. Now examine the contents of the output css file (the cached theme file which Prestashop produces), search for gooey and you will find the relative path has been added as described.

PrestaShop version(s) where the bug happened

8.0.4

PHP version(s) where the bug happened

All

If your bug is related to a module, specify its name and its version

No response

Your company or customer's name goes here (if applicable).

No response

Contributor guide