1434155 - Remove (safe) innerHTML in RDM's Browser component

Status: RESOLVED FIXED

(DevTools :: Responsive Design Mode, enhancement, P3)

Description

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

Once DevTools upgrades to React 16, it should be possible for the Browser component to move away from `innerHTML`.  It's currently used only because React before 16 doesn't allow non-standard attributes.

Actions to take:

1. Convert Browser component to return normal React DOM components
2. Remove `document.allowUnsafeHTML = true;`

Comment 1

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

Attachment: Bug 1434155 - Create RDM viewport as iframe component.

Now that we have React 16 (which includes support for custom attributes instead
of a fixed whitelist), we can create the browser frame in the "usual" way, as
opposed to this `innerHTML` workaround.

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

Comment 2

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

Attachment: Bug 1434155 - Remove extra container around RDM browser.

We can now remove the extra `.browser-container` element around the frame.  It
was only here as a way to invoke React's `innerHTML` for real content.

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

Comment 3

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=e48b4554091f40e1c2573df03e070408d9c35cd2

Comment 4

[Gabriel Luong [:gl] (ΦωΦ)]

Comment on attachment 8950730 [details]
Bug 1434155 - Create RDM viewport as iframe component.

https://reviewboard.mozilla.org/r/219978/#review225808

Comment 5

[Gabriel Luong [:gl] (ΦωΦ)]

Comment on attachment 8950731 [details]
Bug 1434155 - Remove extra container around RDM browser.

https://reviewboard.mozilla.org/r/219980/#review225812

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/4d777d5f3adc
Create RDM viewport as iframe component. r=gl
https://hg.mozilla.org/integration/autoland/rev/e27e05f77f82
Remove extra container around RDM browser. r=gl

Comment 7

[Dorel Luca [:dluca]]

https://hg.mozilla.org/mozilla-central/rev/4d777d5f3adc
https://hg.mozilla.org/mozilla-central/rev/e27e05f77f82