# Forge Custom UI default hello world app with Custom UI does not work

**URL:** <https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066>\
**Category:** Forge UI Kit and Custom UI\
**Tags:** hello-world, getting-started, forge-tunnel, jira-cloud, websockets\
**Created:** [July 21, 2022, 10:32pm UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066 "2022-07-21T22:32:05Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![chhantyal](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/chhantyal/32/47298_2.png) [@chhantyal](https://community.developer.atlassian.com/u/chhantyal)\
**Post date:** [July 21, 2022, 10:32pm UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/1 "2022-07-21T22:32:05Z")

</div>

I created a Forge app with Custom UI. The app is still boilerplate app but I can’t seem to make the auto-reload feature work.

My resources block look like this:

```auto
resources:
  - key: uiModificationsMain
    path: static/hello-world/build

```

Custom UI guide here [https://developer.atlassian.com/platform/forge/build-a-custom-ui-app-in-jira/](https://developer.atlassian.com/platform/forge/build-a-custom-ui-app-in-jira/) does not mention anything about auto-reload.

Currently, I have to run `npm run build` every time I make any changes to test it. What am I missing?

Note: I am using Firefox. Looks like it’s the same issue on Chrome.

---

<div class="post-metadata">

**Author:** ![chhantyal](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/chhantyal/32/47298_2.png) [@chhantyal](https://community.developer.atlassian.com/u/chhantyal)\
**Post date:** [July 21, 2022, 11:03pm UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/2 "2022-07-21T23:03:55Z")

</div>

Ok, just needed to add tunnel section:

```auto
resources:
  - key: uiModificationsMain
    path: static/hello-world/build
    tunnel:
      port: 3000

```

Unfortunately, I have another problem now ☹

`Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”).`

I have just too many troubles making the default hello world app work? ☹

Edit: It is actually trying to load something from http:/localhost:8002 when Custom UI app is running on 3000 and tunnel also is set to 3000.

 ![Screenshot 2022-07-22 at 09.03.34](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/9/6/96b43791c95ea6f56ee74c49078c98981f6ca884.png)

---

<div class="post-metadata">

**Author:** ![JoshuaHwang](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/joshuahwang/32/44116_2.png) [@JoshuaHwang](https://community.developer.atlassian.com/u/JoshuaHwang)\
**Post date:** [July 22, 2022, 5:16am UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/3 "2022-07-22T05:16:10Z")

</div>

Hi,

Don’t know this one off the top of my head. I’ll get in contact with the relevant team though.

---

<div class="post-metadata">

**Author:** ![JoshuaHwang](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/joshuahwang/32/44116_2.png) [@JoshuaHwang](https://community.developer.atlassian.com/u/JoshuaHwang)\
**Post date:** [July 22, 2022, 9:34am UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/4 "2022-07-22T09:34:02Z")

</div>

Hmmm, I don’t know anything in the `forge tunnel` that would use port `8002`. I’ll check on Tuesday but if you could also check on your end if you’re setting something to that port that might lead to the problem.

Someone from the team previously mentioned suggests

```auto
permissions:
  content:
    styles:
      - unsafe-inline
    scripts:
      - unsafe-inline

```

This information is available in our documentation [here](https://developer.atlassian.com/platform/forge/manifest-reference/permissions/#content-permissions).

Do let us know if either of these work out for you.

---

<div class="post-metadata">

**Author:** ![chhantyal](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/chhantyal/32/47298_2.png) [@chhantyal](https://community.developer.atlassian.com/u/chhantyal)\
**Post date:** [July 23, 2022, 1:17pm UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/5 "2022-07-23T13:17:58Z")

</div>

Thanks for the reply. I have already added the permissions for styles and scripts but maybe my yml config was wrong. The error is no longer there.

However, I got another error only on Firefox (works on Chrome).

```auto
Content Security Policy: The page’s settings blocked the loading of a resource at ws://localhost:3000/ws (“connect-src”).

```

 ![Screenshot 2022-07-23 at 15.14.51](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/b/8/b82d931f8fe95e4d1723b37e4f1e3486669b482a.png)

I have no idea why it works on Chrome. I guess Firefox has stricter CSP enforcement?

---

<div class="post-metadata">

**Author:** ![JoshuaHwang](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/joshuahwang/32/44116_2.png) [@JoshuaHwang](https://community.developer.atlassian.com/u/JoshuaHwang)\
**Post date:** [July 28, 2022, 1:00am UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/6 "2022-07-28T01:00:08Z")

</div>

Hi again, the team mentions adding the following to your manifest. It appears firefox blocks websockets

```auto
permissions:
   external:
      fetch:
         client:
            - 'ws://localhost:3000'

```

---

<div class="post-metadata">

**Author:** ![chhantyal](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/chhantyal/32/47298_2.png) [@chhantyal](https://community.developer.atlassian.com/u/chhantyal)\
**Post date:** [July 29, 2022, 10:49am UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/7 "2022-07-29T10:49:36Z")

</div>

> [@JoshuaHwang](#):
>
> ```auto
> external:
> fetch:
> client:
> - 'ws://localhost:3000'
> 
> ```

Looks like localhost is not accepted here. I get this error:

```auto
error Invalid 'external.fetch.client' permission in the manifest.yml file - 'ws://localhost:3000'

```

---

<div class="post-metadata">

**Author:** ![JoshuaHwang](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/joshuahwang/32/44116_2.png) [@JoshuaHwang](https://community.developer.atlassian.com/u/JoshuaHwang)\
**Post date:** [August 1, 2022, 5:36am UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/8 "2022-08-01T05:36:22Z")

</div>

Hi again, thanks for following up.

Would you be able to create a minimal reproducible example?

The team would like one for easier troubleshooting and we’ll be able to give you an answer quicker.

---

<div class="post-metadata">

**Author:** ![JoshuaHwang](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/joshuahwang/32/44116_2.png) [@JoshuaHwang](https://community.developer.atlassian.com/u/JoshuaHwang)\
**Post date:** [December 6, 2022, 1:17am UTC](https://community.developer.atlassian.com/t/forge-custom-ui-default-hello-world-app-with-custom-ui-does-not-work/60066/9 "2022-12-06T01:17:39Z")

</div>

Apologies for taking so long

There was a security policy that prevented non-TLS websockets from being added. That policy still remains but for tunnelling we’re allowing localhost tunnelling.

Please download the latest version of the Forge CLI for it to work
