1355760 - Detect setImageElement to not run on the Chrome browser tab

Status: RESOLVED FIXED

(DevTools :: Netmonitor, enhancement, P1)

Description

[[e-mail]]

waterfall-background.js use `document.mozSetImageElement` API which is a firefox only API. 

We have to wrap it into `utils/set-image-element` and use webpack NormalModuleReplacementPlugin to resolve relative require path. With that way we can run the Network Monitor on an chrome browser tab.

Comment 1

[[e-mail]]

Attachment: Bug 1355760 - detect setImageElement to not run on Chrome browser tab;

Review commit: https://reviewboard.mozilla.org/r/129400/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/129400/

Comment 2

[Ricky Chien [:rickychien] (inactive)]

Comment on attachment 8857411 [details]
Bug 1355760 - detect setImageElement to not run on Chrome browser tab;

https://reviewboard.mozilla.org/r/129400/#review132320

Thanks for doing this. I've some opinions about this APIs extraction.

mozSetImageElement is a non-standart API, so it's hard to replace with an alternative starnd setImageElement when running other browsers. As a result, it's not that easy to implement a setImageElement in utils/chrome/ although it makes sense to support setImageElement in utils/firefox/.

IMHO, the setImageElement API extraction would be useless in the future. And further, the best thing would be rewrite the waterfall-background.js, and create overly and then draw red / blue line on top of request list timeline.

But yes, we're not going to do this in this patch, so I'd suggest using a simple fix. Adding a simple check in waterfall-background.js

```
// Write down documentation about this hack
if (!document.mozSetImageElement) {
  document.mozSetImageElement = () => {};
}
```

btw, I remember there is a getBoxQuads() API which only work in firefox, do you need to wrap it by an empty shim like this?

Comment 3

[[e-mail]]

Comment on attachment 8857411 [details]
Bug 1355760 - detect setImageElement to not run on Chrome browser tab;

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/129400/diff/1-2/

Comment 4

[[e-mail]]

I did not saw any `getBoxQuads` error in chrome console after applied this patch

Comment 5

[Ricky Chien [:rickychien] (inactive)]

Comment on attachment 8857411 [details]
Bug 1355760 - detect setImageElement to not run on Chrome browser tab;

https://reviewboard.mozilla.org/r/129400/#review132416

::: devtools/client/netmonitor/src/waterfall-background.js:35
(Diff revision 2)
> +/**
> + * Changes the element being used as the CSS background for a background
> + * with a given background element ID.
> + */

nit: I think we can explain this hack is about `This is a shim method which will not draw waterfall vertical line when running launchpad on non-firefox browser` or something like that.

Comment 6

[[e-mail]]

Comment on attachment 8857411 [details]
Bug 1355760 - detect setImageElement to not run on Chrome browser tab;

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/129400/diff/2-3/

Comment 7

[[e-mail]]

add more comment and refer to bug 1308695, thanks

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/b82af800c6da
detect setImageElement to not run on Chrome browser tab;r=rickychien

Comment 9

[Sebastian Hengst [:aryx] (needinfo me if it's about an intermittent or backout)]

https://hg.mozilla.org/mozilla-central/rev/b82af800c6da