[accelerometer] Image fallback code fails very badly if *both* images error

tabatkins has just created a new issue for https://github.com/w3c/accelerometer:

== Image fallback code fails very badly if *both* images error ==
On many of your SVG images, you have code like:

```
<img src="foo.svg" onerror="this.src='foo.png'">
```

The obvious *intention* here is that, for ancient browsers that don't understand SVG images, you fall back to the PNG version.

However, if the PNG version also fails (such as, for example, if I've pulled the .bs file locally and am rendering it by itself, without the rest of the repository...), then the image just forever cycles and the page is never allowed to finish loading. What's worse, at least on Chrome, the image itself constantly resets between "broken" and "loading", which changes its height (from the height of the broken-image icon to 0x0, then back again), so the entire spec following the first such image is rapidly shifting up and down forever.

This functionality probably isn't important to keep (I haven't seen it anywhere else, and browsers that don't understand SVG are *ancient* at this point, and not worth targetting for the audience of "people that read specs"), but if it is, could you instead abstract it out to a `<script>` block and make it more robust, perhaps with something like:

```html
<script>
function pngOnError(img) {
  this.src = this.src.slice(0,-3) + "png";
  this.onerror = null;
}
</script>
<img src="foo.svg" onerror=pngOnError>
```

Please view or discuss this issue at https://github.com/w3c/accelerometer/issues/48 using your GitHub account

Received on Tuesday, 21 August 2018 20:07:06 UTC