Opened 3 years ago

Closed 3 years ago

Last modified 3 years ago

#32671 closed Uncategorized (wontfix)

CSS var() causes relative URLs to break in Safari

Reported by: Perry Roper Owned by: Perry Roper
Component: contrib.admin Version: 3.2
Severity: Normal Keywords:
Cc: Triage Stage: Unreviewed
Has patch: yes Needs documentation: no
Needs tests: no Patch needs improvement: no
Easy pickings: no UI/UX: yes

Description (last modified by Perry Roper)

There is a bug in Safari where using the var() property alongside a url() that contains a relative path, the relative path will break. The bug also existed in Chrome (https://bugs.chromium.org/p/chromium/issues/detail?id=618165), which has been fixed. However the Safari bug still exists as of Mac OS 11.2.3.

Expected Output

https://i.imgur.com/r6rQuO6.png

Actual Output

https://i.imgur.com/eVqLZbP.png
https://i.imgur.com/Tj3f0O4.png

As you can see from the console, the URLs end up being relative to the current page URL, not the CSS file URL in which they are loaded.

This bug was introduced in https://github.com/django/django/commit/0a802233ec1421e5e59a486be69daef9b112fd0d

GitHub Pull Request: https://github.com/django/django/pull/14294

Change History (3)

comment:1 by Perry Roper, 3 years ago

Description: modified (diff)
Owner: changed from nobody to Perry Roper
Status: newassigned

comment:2 by Carlton Gibson, 3 years ago

Resolution: wontfix
Status: assignedclosed

Using the fiddle from the Chromium issue linked: https://jsfiddle.net/cgalvist/emmcbwzn/15/ (and actual admin example)

This is fixed in the macOS 11.3 beta, with Safari Version 14.1 (16611.1.21.161.3).

As such I'm not sure this is worth working around for us. Let's just wait for the fix to ship.

Last edited 3 years ago by Carlton Gibson (previous) (diff)

comment:3 by Carlton Gibson, 3 years ago

For reference here is the WebKit issue showing it as resolved. https://bugs.webkit.org/show_bug.cgi?id=198512

Note: See TracTickets for help on using tickets.
Back to Top