[UI] TFDV visualization frame is blank in Chrome 80

[Bobgy]

What happened:
Visualization UI is broken after upgrading to Chrome 80. It turns blank and console has a line of warning:

HTML Imports is deprecated and has now been removed as of M80. See https://www.chromestatus.com/features/5144752345317376 and https://developers.google.com/web/updates/2019/07/web-components-time-to-upgrade for more details.

/priority p0

What did you expect to happen:
It should show up.

What steps did you take:
[A clear and concise description of what the bug is.]

1. Upgrade to chrome 80
2. Visit existing visualizations that used to work

Anything else you would like to add:
[Miscellaneous information that will assist in solving the issue.]

[Bobgy]

Did some investigation, it seems not our UI is broken, the visualization itself is broken.

According to https://developer.mozilla.org/en-US/docs/Web/Web_Components/HTML_Imports.
Html import means links like the following (rel="import" is the special part):

<link rel="import" href="myfile.html">

I found usage of it in visualization result iframe

<link rel="import" href="https://raw.githubusercontent.com/PAIR-code/facets/master/facets-dist/facets-jupyter.html">

[Bobgy]

Opened issue in upstream repo facets (used by tfdv): PAIR-code/facets#207

[Bobgy]

Updated title, this only affects tfdv

[rmgogogo]

@rmgogogo

[rmgogogo]

Upstream issue: PAIR-code/facets#207

[Bobgy]

TFDV upstream issue is tensorflow/data-validation#108

[Bobgy]

/cc @Realsen
FYI, you probably may hit the issue in TFMA too.

[Bobgy]

Upstream issue already fixed, tfdv has just released this publically: https://github.com/tensorflow/data-validation/releases/tag/v0.21.1

@jingzhang36 how can we pin to a later version in tfdv?

[Bobgy]

/close
Fixed by #3060

[k8s-ci-robot]

@Bobgy: Closing this issue.

In response to this:

/close
Fixed by #3060

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

[Bobgy]

/reopen
The last fix wasn't enough. It is still blank like

I found it was caused by </script> in string breaking wrapping tags. Sent a CL to fix upstream issue again.

[k8s-ci-robot]

@Bobgy: Reopened this issue.

In response to this:

/reopen
The last fix wasn't enough. It is still blank like

I found it was caused by </script> in string breaking wrapping tags. Sent a CL to fix upstream issue again.

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

[Bobgy]

This also needs #3079 to be fixed first

[Bobgy]

Another upstream bug fixed in tensorflow/data-validation@8cb3ca8, waiting for tfdv release so we can bump version again.

[Bobgy]

We can use https://github.com/tensorflow/data-validation/releases/tag/v0.21.2.

[Bobgy]

Changed to p1, because @rmgogogo has #3089 to workaround the issue. We can switch back to tfdv package now as a clean-up.

[Bobgy]

/assign @jingzhang36
Can you do the follow up clean up?

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale]

This issue has been automatically closed because it has not had recent activity. Please comment "/reopen" to reopen it.