An annoying SVG animation bug in Chrome

Terence Eden — Mon, 23 Jun 2025 11:34:12 +0000

Writing web standards is hard⁰. You have to write a formal specification which is useful for machines, humans, and web developers¹.

I recently stumbled across what I think is a little bug which might be caused by a misreading of the SVG Animation specification. Here you should see two overlapping circles gradually appear:

If you're on Chrome, you might only see one circle animate. Why? Bloody semicolons! The bane of every programmer's existence².

The specification for SVG Animation has this text for human readers:

keyTimes

A semicolon-separated list of time values used to control the pacing of the animation. Each time in the list corresponds to a value in the ‘values’ attribute list, and defines when the value is used in the animation function.

[…]

If the last semicolon separator is followed by either just white space or no more characters, ignore both the separator and the trailing white space.

To me, that isn't ambiguous. The text keyTimes="0; 1;" has a final semicolon with nothing after it. Therefore it should be ignored. Instead, Chrome throws an hissyfit and says Error: <animate> attribute keyTimes: Invalid value, "0; 1;".

But maybe the humans who wrote the description were sloppy. There's also a machine-readable formal specification. It defines the acceptable sequence as being:

<number> [; <number>]* ;?

This isn't quite Backus–Naur form³, but rather CSS Values.

The <number> is a component.
The [ and ] are grouping combinators.
The * and ? are component multipliers
- * "indicates that the preceding type, word, or group occurs zero or more times."
- ? "indicates that the preceding type, word, or group is optional (occurs zero or one times)."
The ; is just a semicolon⁴.

Reading the definition tells us that a valid value will be a number, followed by zero-or-more groups of "semicolon and another number" with an optional final semicolon.

So, based on my reading, I think Chrome is wrong to throw an error here. Both Firefox and Safari work with a trailing semicolon.

Accordingly, I've raised a bug with the Chromium team. If you think I have erred in this matter, please let me know.

I do have some experience in this matter. ↩︎
Back in 2006, Catharine A. MacKinnon provokatively asked "Are Women Human?". Her argument (which I shall badly summarise) is that if women were human, then they'd be protected by universal human rights. Given the state of the world then (and now) it is hard to argue that women receive as great a level of attention as the default male. I don't intend to trivialise MacKinnon's work - but I do find it interesting that developers are often treated separately from other humans. ↩︎
I imagine English literature students also find them confusing; everyone does. ↩︎
Also the bane of programmers everywhere! ↩︎
Just like how sometimes a cigar is just a cigar. ↩︎

RTL Bugs

Terence Eden — Mon, 24 Feb 2014 12:02:16 +0000

Take a look at the following text, looks normal enough doesn't it?

"Harry ‮".draziw a si ‭Potter

Now, try to select the text and see what happens.

WHAT WITCHCRAFT IS THIS?!

If you examine the source code for this page, you'll see that I'm using the Unicode Bi-Directional characters.

"Harry &#x202e;".draziw a si &#8237;Potter

These characters are useful when writing text that includes, say, English and Arabic - but they can also be used for malicious purposes.

On a more mundane level, they can cause all sorts of UI bugs. I've just filed a bug against the Chrome browser for how it handles these characters.

If you right click on text with mixed direction, you'll notice that the UI behaves oddly.

In Firefox, the behaviour is correct - although one could argue whether "Potter" ought to be reversed.

Searching

So, what happens when we run these searches?

Neither Firefox nor Chrome do particularly well. I'm not sure if the reversed text in the window title and URL bar are bugs in Ubuntu - or whether it's the fault of the app itself.

On Windows and Mac, we see this happen:

This would suggest that Google isn't correcting the direction of the text and that is deforming its own title tags.

Are These Bugs?

Ok, so having the title reversed isn't the worst problem in the world. But do these examples count as bugs and, if so, who is responsible for them?

Every search engine I tried passed through the right-to-left-over-ride unscathed - so that's the fault of the search engine, right? How the hell do you a report a bug to Google?

The title bar could either be a problem with the browser - Firefox has a bug report over a year old on the issue - or the problem could be with the underlying operating system. How would one find out?

Thanks