Lmst
Login

#SafariBug

Ana Tudor 🐯anatudor
2025-04-07

Fun Safari bug 🪲: `drop-shadow()` does't take transforms into account bugs.webkit.org/show_bug.cgi?i 👀

Ana Tudor 🐯anatudor
2024-09-01

3️⃣ And this Safari bug which makes `background-blend-mode` get ignored if a layer has `background-clip: text`

bugs.webkit.org/show_bug.cgi?i

Collage showing the expected vs. the Epiphany result when trying to blend two background layers out of which at least one has background-clip: text. The Epiphany result completely ignores the blending operation.
Ana Tudor 🐯anatudor
2024-06-18

I really meant to write "hello world" there, but "hell" isn't wrong, so I left it like that.

Anyway, you can find the bug links & all in the Pen description.

Screenshot of the details page on CodePen with all the relevant links.
Ana Tudor 🐯anatudor
2024-05-13

As exciting (and useful) all the new units are, it looks like things working as expected with them isn't a thing for now.

Safari has problems with `lh` bugs.webkit.org/show_bug.cgi?i and doesn't seem to support `cap` (at least from what I've tested in Epiphany).

Ana Tudor 🐯anatudor
2024-04-29

Pure CSS text effect codepen.io/thebabydino/details

No text duplication, no JS, no images save for CSS gradients, no SVG at all. Under 20 CSS declarations, including layout, prettifying, `@​media` queries, `@​supports` blocks, CSS variable declarations...

No Firefox (bug 🪲 1481498 ).

Heavily commented as well.

Shows the text "dreams" in narrow all caps on top of a leaves under blue light background. This text has a split line along the main diagonal. To the bottom left of this split line, the text is filled (white) and has no background. To the top right of this split line, the text is just stroked (white) with no fill and has a medium blue stripes horizontal background.
Ana Tudor 🐯anatudor
2024-03-06

Wanted to file another Safari 🪲 I had hit a bunch of times (and piled a bunch of test cases about) and discovered it has already been filed bugs.webkit.org/show_bug.cgi?i

Next bug then...

Ana Tudor 🐯anatudor
2024-03-06

A really strange 🙀 🪲 in bugs.webkit.org/show_bug.cgi?i

Ana Tudor 🐯anatudor
2024-01-06

Another Safari bug 🪲 filed: incorrect `lh` (line-height) value used unless set on parent bugs.webkit.org/show_bug.cgi?i

Screenshot. Shows two paragraphs, each with thin horizontal blue lines perfectly aligned in between lines of text.Screenshot. Shows two paragraphs, each with thin horizontal blue lines backgrounds. In the second case, the thin blue lines are perfectly aligned in between the lines of text. In the first case however, this alignment looks broken.
Ana Tudor 🐯anatudor
2024-01-05

And another Safari 🪲 bug: no swatch to trigger the picker inside gradient functions unless using CSS variable stops bugs.webkit.org/show_bug.cgi?i

Epiphany screenshot. Shows the following code: ``` border-image: conic-gradient(hotpink 75deg, steelblue) fill 0; background: linear-gradient(var(--c, hotpink) 35%, steelblue); background-color: color-mix(in hsl, hotpink 35%, steelblue); color: color-mix(in hsl, var(--c, hotpink) 35%, steelblue); accent-color: color-mix(in hsl, hotpink var(--p, 35%), steelblue); mask: radial-gradient(hotpink var(--p, 5em), steelblue); ``` There's no swatch to trigger the picker for any of the `<color>` values inside CSS gradients... unless they're set as custom properties?!
Ana Tudor 🐯anatudor
2024-01-05

`background-blend-mode` is not applied in Safari when at least one of the layers blended has `background-clip: text`.

Bug 267129 🪲 bugs.webkit.org/show_bug.cgi?i

Live test codepen.io/thebabydino/pen/MWx

There are workarounds, but involve using a pseudo that wouldn't otherwise be needed at best & multiple text copies if 2+ `background` layers need to be restricted to `text`. If the text should also be `contenteditable`... 😭

Collage. Left: Screenshot of the expected result. Shows 3 panels. Top panel shows a top to bottom red to black gradient blended with a repeating diagonal blue to black gradient. Middle panel shows the same, except the top layer is clipped to the text "CAT", so the blending only happens in that text area. The rest of the panel is only covered in the bottom background layer. Bottom panel has both layers clipped to the same text "CAT", so the blending only happens in that area, while the rest is transparent. Right: Screenshot of the Epiphany result. Shows 3 panels. Top panel shows a top to bottom red to black gradient blended with a repeating diagonal blue to black gradient. Middle panel shows almost same, except the top layer is clipped to the text "CAT" and the blending doesn't happen anymore, the top layer overlaps and covers the bottom one in that area. The rest of the panel is only covered in the bottom background layer. Bottom panel shows almost the same, except both layers are clipped to the same "CAT" text. All around the text remains transparent.
Ana Tudor 🐯anatudor
2023-10-18

Here's a really weird CSS grid bug 🪲bugs.webkit.org/show_bug.cgi?i in Safari 👀

All these boxes should look exactly the same codepen.io/thebabydino/pen/KKb
(and they do in Chrome & Firefox)

Screenshot illustrating the problem in Safari: the height used to compute the position/ height of a grid is that of the border-box if the grid parent's height was set using aspect-ratio.
ITSEC Newsitsecbot@schleuss.online
2020-04-06

Apple Safari Flaws Enable One-Click Webcam Access - The white hat hacker who discovered the vulnerabilities received a $75,000 from Apple's bug-bounty... more: threatpost.com/apple-safari-fl #applevulnerability #vulnerabilities #mobilesecurity #applebugbounty #webcamtakeover #applesafari #ryanpickren #safaribug #webcam #apple #macos #patch #ios

Client Info

Server: https://mastodon.social
Version: 2025.04
Repository: https://github.com/cyevgeniy/lmst