Deprecate and remove extra_html_url config option

[balloob]

The request

We used to allow the user to specify HTML files via extra_html_url that we would import into the page. When it became clear that HTML imports were not going to make it, we replaced that with extra_module_url and extra_js_url_es5 (home-assistant/core#24675 by @thomasloven, June 21, 2019).

I think that it's time to deprecate and remove this option. Because we still support this, we have been including it in the main entrypoint of our app, 450 lines of JS 🙄

Note that this does not impact referencing html in Lovelace resources.

Places to update:

• Remove polyfill from app.ts
• Remove <link rel="import" writer from index.html.template
• Remove options from frontend/__init__.py (in core)

The alternatives

Additional information

[Mariusthvdb]

many people love and use the custom-ui plugin to add customizations to Homeassistant the current core Lovelace frontend doesn't cater for (global customization), and their frontends depend on that. Some custom cards can customize on an entity or card level, but none have the power nor possibilities of custom-ui.
Making custom-ui a unique and essential plugin, which should be preserved, at least until a core Lovelace replacement has been created. I've had a friendly nod at Bram, but he has understandably replied facing the time to do so, or at least maintain that.

That being the case, Id like to add to this discussion, to please not break custom-ui until then.

So let me ask if your plan above will, knowing that Custom-ui can be activated via either

frontend:
  extra_html_url:
    - /local/custom_ui/state-card-custom-ui.html

or:

customizer:
  custom_ui: local

which in itself loads custom-ui again via:

        if custom_ui == LOCAL:
            add_extra_html_url('/local/custom_ui/state-card-custom-ui')

HA110 broke original custom-ui because if the new icon handling, but Bram and I managed to fix that, and people are able to use custom-ui from 110+.

Would there be an alternative way to load custom-ui when the 'extra_html_url' would be deprecated? (I take it the customizer way would also fail?)

Thanks for considering.

[bramkragten]

@Mariusthvdb custom-ui can perfectly be imported as a Javascript module, would just need to change the way it is built. We can not keep things around because of custom projects that are not being updated anymore.

[thomasloven]

It's about time, but I assume there'll be a two version deprecation warning or so?

In the custom-ui case it may just be as simple as removing the first and last lines of state-card-custom-ui.html and changing extra_html_url to extra_module_url. I may also absolutely wrong. Perhaps you could be so kind as to test this, @Mariusthvdb?

[bramkragten]

Oh yeah it is just wrapped in a script block... That should work

[Mariusthvdb]

testing... Thanks for the suggestion, how great this would be...

just to be sure, the last line now is:

//# sourceMappingURL=scripts.js.map</script>

and I change that to

//# sourceMappingURL=scripts.js.map

? or should I take out the full line. thought this was a comment, so should not interfere?
while at it, and assuming this would work, shouldn't we rename the file and add it as resource .js as we do with all other custom cards?

update

my edit above doesnt work.... all customizations are gone. I used this yaml:

frontend:
  themes: !include_dir_merge_named frontend_themes
  extra_module_url:
    - /local/custom_ui/state-card-custom-ui.html

There's also no mentioning anymore of any custom-ui in the developer-tools/info

[thomasloven]

It was a bit of a long shot, but it could have worked.

[Mariusthvdb]

error in inspector:

[thomasloven]

Ah. Try just renaming it from .html to .js then. (and change the filename in extra_module_url too)
The .gz file might still cause trouble, though, but it's worth a try.

[Mariusthvdb]

no .gz file in my folder, only the html, now .js file.

It is loaded, and proof of that is:

it now shows an new error:

fear there's a bit more to in than this..

fwiw, Ive loaded it via

frontend:
  extra_module_url:
    - /local/custom_ui/state-card-custom-ui.js

which in itself works, as this exercise proofs ;-)

[Mariusthvdb]

have to report succes on custom-ui after all. Thomas's suggestions work. I made the edits in the original file, and not my own edited custom-ui file.... really sorry for the confusion.

Ive branded the file with JS 20200520-adapted-for-HA110 locally as to be sure it is loaded correctly:

and

@Supremelink made me see that... here andrey-git/home-assistant-custom-ui#184 (comment)

so Thomas: thanks again!
hope this stays now....

[Mariusthvdb]

small update: no longer need the frontend: method for custom-ui, now use resources. Made a rudimentary dedicated repo for easy downloading and instructions. Hope this is ok. All credits to Andrey.

[KTibow]

Time to close?