# UXP WebView support for loading local html content

**URL:** <https://forums.creativeclouddeveloper.com/t/uxp-webview-support-for-loading-local-html-content/5642>\
**Category:** Photoshop\
**Created:** [January 1, 2023, 12:40am UTC](https://forums.creativeclouddeveloper.com/t/uxp-webview-support-for-loading-local-html-content/5642 "2023-01-01T00:40:01Z")\
**Posts on this page:** 4\
**Page:** 2

<div class="post-metadata">

**Author:** ![PS-fxrios](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/ps-fxrios/32/2461_2.png) [@PS-fxrios](https://forums.creativeclouddeveloper.com/u/PS-fxrios)\
**Post date:** [January 18, 2023, 3:49pm UTC](https://forums.creativeclouddeveloper.com/t/uxp-webview-support-for-loading-local-html-content/5642/22 "2023-01-18T15:49:48Z")

</div>

@Timothy_Bennett today I decided to run some tests on my plugin that loads external html tags via the fetch(path).text() method and I came across a very serious error like: The index.html or manifest.json don’t seem to recognize any UXP interface input, like sp-button, sp-slider… from the external.htm file, as I get the error when adding any event listener in the js.

 ![Captura de tela 2023-01-18 124245](https://us1.discourse-cdn.com/flex015/uploads/xdplugins/original/2X/6/6a084d870655524ac4b62dca1253e68bc2349fa6.jpeg)

How do you go about solving this? Thanks.  
Here is my very simple project  
[https://www.mediafire.com/file/c3b47lt5zw1fl1d/UXP-external\_html.rar/file](https://www.mediafire.com/file/c3b47lt5zw1fl1d/UXP-external_html.rar/file)

---

<div class="post-metadata">

**Author:** ![Karmalakas](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/karmalakas/32/1048_2.png) [@Karmalakas](https://forums.creativeclouddeveloper.com/u/Karmalakas)\
**Post date:** [January 18, 2023, 8:21pm UTC](https://forums.creativeclouddeveloper.com/t/uxp-webview-support-for-loading-local-html-content/5642/23 "2023-01-18T20:21:51Z")

</div>

When `index.js` is loaded, you still don’t have `#btn2` in your HTML, hence the error. You should add this listener after modal is loaded and this button is rendered

---

<div class="post-metadata">

**Author:** ![PS-fxrios](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/ps-fxrios/32/2461_2.png) [@PS-fxrios](https://forums.creativeclouddeveloper.com/u/PS-fxrios)\
**Post date:** [January 19, 2023, 1:22am UTC](https://forums.creativeclouddeveloper.com/t/uxp-webview-support-for-loading-local-html-content/5642/24 "2023-01-19T01:22:40Z")

</div>

Hi @Karmalakas thanks for the tip, a workable solution I found here was to add all ovintes inside own function that loads the modal at the end of the block.

 ![Capturar](https://us1.discourse-cdn.com/flex015/uploads/xdplugins/original/2X/d/d303c9aba0f14d1c27282c7cc3a7c8eed897bb80.png)

---

<div class="post-metadata">

**Author:** ![Zob](https://avatars.discourse-cdn.com/v4/letter/z/87869e/32.png) [@Zob](https://forums.creativeclouddeveloper.com/u/Zob)\
**Post date:** [March 7, 2023, 12:08am UTC](https://forums.creativeclouddeveloper.com/t/uxp-webview-support-for-loading-local-html-content/5642/25 "2023-03-07T00:08:51Z")

</div>

Haven’t gotten fetch() to work at all yet on files in my plugin dir. Instead, I’ve been using fs.readFile and fs.readFileSync to the same effect.  
e.g.

```auto
const fs = require('fs')
//blocking load
const HTMLString = fs.readFileSync('./dialogs/myDialog.html', 'utf-8')

```

One thing to note about setting the inner HTML in this way is that you can’t have bound executions in the HTML. For example, its convenient to make the cancel and OK button close the dialog window by doing this:

```auto
<sp-button
id="myDialogCancelBtn"
onclick = document.querySelector("#myDialogID").close("cancel")
>

```

But you will get an exception and the inner HTML will be refused.  
The solution is to bind those things via JS after the fact using .addEventListener() on the element.

[Previous page](https://forums.creativeclouddeveloper.com/t/uxp-webview-support-for-loading-local-html-content/5642.md?page=1)