AWX Web UI shows an error

[jattind]

Please confirm the following

• I agree to follow this project's code of conduct.
• I have checked the current issues for duplicates.
• I understand that AWX is open source software provided for free and that I might not receive a timely response.
• I am NOT reporting a (potential) security vulnerability. (These should be emailed to [email protected] instead.)

Bug Summary

Summary

After a fresh install on docker, the webui of awx is not reachable.

When I open: https://192.168.1.104:8043/#/home, I get the following error:

<% if (process.env.NODE_ENV === 'production') { %> <% } %> <% if (process.env.NODE_ENV === 'production') { %> <% } else { %> <% } %> <% if (process.env.NODE_ENV === 'production') { %>

I see the following on the console:

tools_awx_1 | awx-uwsgi stderr | [pid: 391|app: 0|req: 59/71] 192.168.1.66 () {58 vars in 1076 bytes} [Wed Aug 23 23:40:15 2023] GET / => generated 2148 bytes in 55 msecs (HTTP/1.1 200) 7 headers in 269 bytes (1 switches on core 0)
tools_awx_1 | awx-uwsgi stderr | 

Seems there is a previous issue already filed, but this was closed because the user did not do a clean and build the UI
#11774

In my case I did do a clean and build of the UI

docker exec tools_awx_1 make clean-ui ui-devel
rm -rf node_modules
rm -rf awx/ui/node_modules
rm -rf awx/ui/build
rm -rf awx/ui/src/locales/_build
rm -rf awx/ui/.ui-built
mkdir -p awx/ui/build/static
NODE_OPTIONS=--max-old-space-size=6144 npm --prefix awx/ui --loglevel warn --force ci
npm WARN using --force Recommended protections disabled.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated

added 1882 packages, and audited 1883 packages in 40s

123 packages are looking for funding
  run `npm fund` for details

10 vulnerabilities (3 moderate, 7 high)

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
make[1]: Entering directory '/awx_devel'
make awx/ui/node_modules
make[2]: Entering directory '/awx_devel'
NODE_OPTIONS=--max-old-space-size=6144 npm --prefix awx/ui --loglevel warn --force ci
npm WARN using --force Recommended protections disabled.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated

added 1882 packages, and audited 1883 packages in 44s

123 packages are looking for funding
  run `npm fund` for details

10 vulnerabilities (3 moderate, 7 high)

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
make[2]: Leaving directory '/awx_devel'
python3.9 tools/scripts/compilemessages.py
processing file django.po in /awx_devel/awx/locale/fr/LC_MESSAGES

processing file django.po in /awx_devel/awx/locale/en-us/LC_MESSAGES

processing file django.po in /awx_devel/awx/locale/es/LC_MESSAGES

processing file django.po in /awx_devel/awx/locale/ja/LC_MESSAGES

processing file django.po in /awx_devel/awx/locale/ko/LC_MESSAGES

processing file django.po in /awx_devel/awx/locale/nl/LC_MESSAGES

processing file django.po in /awx_devel/awx/locale/zh/LC_MESSAGES

npm --prefix awx/ui --loglevel warn run compile-strings

> compile-strings
> lingui compile

Compiling message catalogs…
Done!
npm --prefix awx/ui --loglevel warn run build

> build
> INLINE_RUNTIME_CHUNK=false react-scripts build

Creating an optimized production build...
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme
Compiled with warnings.

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/cache.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/cache.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/callbackiterresult.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/callbackiterresult.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/datetime.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/datetime.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/dateutil.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/dateutil.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/datewithzone.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/datewithzone.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/helpers.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/helpers.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/index.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/index.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iter/index.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iter/index.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iter/poslist.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iter/poslist.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/easter.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/easter.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/index.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/index.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/monthinfo.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/monthinfo.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/yearinfo.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iterinfo/yearinfo.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iterresult.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iterresult.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/iterset.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/iterset.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/masks.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/masks.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/nlp/index.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/nlp/index.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/nlp/i18n.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/nlp/i18n.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/nlp/parsetext.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/nlp/parsetext.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/nlp/totext.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/nlp/totext.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/optionstostring.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/optionstostring.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/parseoptions.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/parseoptions.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/parsestring.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/parsestring.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/rrule.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/rrule.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/rruleset.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/rruleset.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/rrulestr.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/rrulestr.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/types.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/types.ts'

Failed to parse source map from '/awx_devel/awx/ui/node_modules/rrule/src/weekday.ts' file: Error: ENOENT: no such file or directory, open '/awx_devel/awx/ui/node_modules/rrule/src/weekday.ts'

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

File sizes after gzip:

  907.99 kB  build/static/js/main.8777efd8.js
  99.26 kB   build/static/css/main.3086c5d5.css
  61.85 kB   build/static/js/489.6fff47ab.chunk.js
  48.75 kB   build/static/js/118.55093eea.chunk.js
  45.69 kB   build/static/js/138.c73deea6.chunk.js
  44.34 kB   build/static/js/787.08a18937.chunk.js
  44.06 kB   build/static/js/896.7b610740.chunk.js
  43.2 kB    build/static/js/11.355f18b0.chunk.js
  42.28 kB   build/static/js/418.0a72109b.chunk.js
  30.71 kB   build/static/js/311.0bfa73ce.chunk.js
  386 B      build/static/js/979.f16bcc0c.chunk.js

The bundle size is significantly larger than recommended.
Consider reducing it with code splitting: https://goo.gl/9VhYWB
You can also analyze the project dependencies: https://goo.gl/LeUzfb

The project was built assuming it is hosted at ./.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.

Find out more about deployment here:

  https://cra.link/deployment

touch awx/ui/.ui-built
make[1]: Leaving directory '/awx_devel'

The REST API Works.

AWX version

X-API-Product-Version: 22.7.0

Select the relevant components

• UI
• UI (tech preview)
• API
• Docs
• Collection
• CLI
• Other

Installation method

docker development environment

Modifications

no

Ansible version

ansible 2.10.8

Operating system

Ubuntu 22.04

Web browser

Chrome

Steps to reproduce

Follow the steps outlined in https://github.com/ansible/awx/tree/devel/tools/docker-compose
Perform build and clean of the UI
Access the UI via the browser.

Expected results

I should be able to see the AWX UI.

Actual results

Instead I see an error on the browser:

<% if (process.env.NODE_ENV === 'production') { %> <% } %> <% if (process.env.NODE_ENV === 'production') { %> <% } else { %> <% } %> <% if (process.env.NODE_ENV === 'production') { %>

Additional information

No response

[jattind]

I tried doing UI clean and build as sudo and now the UI comes up correctly. Following works:

sudo docker exec tools_awx_1 make clean-ui ui-devel