Help using HtmlDialog

Hi Community,
I’m facing an issue with UI::HtmlDialog in SketchUp 2023.
It seems that some of my extension files are not reachable by the extension.

In this image, you can see that there’re some import issues:

And indeed these files do not appear when I checked the “Source” tab:

But they are present in my local:

What’s even more puzzling is that as you can see on the pictures, there’s still some code in these “ghost” files that’s being used since there’s something displayed in the extension window.

Do you have some ideas about the origin of this issue?

Additional notes:

  • I’m using SvelteKit with the static-adapter to build the html,css and js files.
  • The extension works fine in SketchUp 2025

Addional notes:

  • The extension works also fine in SketchUp 2024

Generally, JavaScript modules must be loaded from a server.

The restriction on loading JavaScript modules using the file:// protocol is primarily due to security concerns. Modern browsers treat local files as having opaque origins, meaning they are considered distinct from one another. This is part of the same-origin policy, which prevents scripts from accessing resources from different origins to protect against malicious activity.

In the CEF DevTools console, the message:

The server responded with a Non-JavaScript MIME type of "".

… means that the server (even the localhost://) must return the MIME type in the header of "text/javascript". This does not usually happen for js files loaded using file://.

Mozilla.org: JavaScript modules

To get modules to work correctly in a browser, you need to make sure that your server is serving them with a Content-Type header that contains a JavaScript MIME type such as text/javascript . If you don’t, you’ll get a strict MIME type checking error along the lines of “The server responded with a non-JavaScript MIME type” and the browser won’t run your JavaScript.

This may have changed with later version of CEF or the SketchUp dev team may have tweaked SketchUp’s CEF to fix this in SU 2024 and later?


SU 2024 update CEF to version 112 and SU 2025 updated to version 128.

SU 2021.1 … SU 2023 was still using CEF version 88.

1 Like

Thanks a lot for your insightful answer @DanRathbun!

So if I understand correctly, to have a js module work in SketchUp 2023, it would need to be hosted on a server.

It seems to me that modern JS frameworks like React and Sveltekit rely on Javascript modules that have either local paths “./<my_path>” or domain paths “/<my_path>”:

  • Local paths seem to be incompatible as we’ve seen.
  • Domain paths seems to be incompatible since it is not possible to “attach” a domain name to the “context” of a SketchUp extension.

Do you know if there’s a way to use a modern JS framework to build an extension for SketchUp 2023?

You will need to run a local server in order to use JS modules (or host the modules out on the web somewhere.)

SketchUp 2023 used Ruby 2.7.7 whose standard library still came with WEBrick server library.

module WEBrick - webrick: Ruby 2.7.7 Standard Library Documentation

The WEBrick server library was removed from Ruby with the Ruby 3.0 release. It is now hosted (along with other server gems) at RubyGems.org.

1 Like

Makes sense :light_bulb:
Thanks a lot for your very helpful answers @DanRathbun!