Error when trying to run the example

[aleBranching]

Loving this repo btw. These are really useful.

Describe the bug
The website has MIME type mismatch. The script from “http://localhost:3000/dist/frontend.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type.

To Reproduce
nvm version: 0.39.7
Node version: node v14.17.6 (npm v6.14.15)
yarn version: 1.22.22

• In the top level of the monorepo run yarn install
• Bootstrap a new React application: npx create-react-app bs-app --template file:./dev-cookbook/cra-template-brightsign-app
• Run the example locally cd bs-app yarn && yarn start
• Publish to brightsign via DWS PLAYER=your.device.ip.address PLAYER_PW=yourdeviceserialnumber yarn run put:prod

Screenshots

Screenshot of running it locally

Screenshot of running it from brightsign

BrightSign Device (please complete the following information):

• FWVersion: '8.5.47',
• bootVersion: '8.0.94',
• Device model: XT1144

[diegobrsign]

Thank you for reporting this! This occurs because of how the code is run by the react scripts vs. how it is run on the device. the path for /dist/frontend.js is not resolving correctly when using yarn start. However you should not see this error if using the remote inspector when the code is running on your BrightSign device.

We will work on a fix so it behaves the same in both cases.

[aleBranching]

Hello,
it seems I still can't get the examples to run on the brightsign. I've attempted on both the series 4 and series 5 model.

boot version: 9.085
model: XT1145

log after running npx create-react-app bs-app --template file:./dev-cookbook/cra-template-brightsign-app

emplate-brightsign-app
npx: installed 64 in 4.028s

Creating a new React app in /home/[MYUSERNAME]/repos/bs-app.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template-brightsign-app...


> core-js@3.37.1 postinstall /home/[MYUSERNAME]/repos/bs-app/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"


> core-js-pure@3.37.1 postinstall /home/[MYUSERNAME]/repos/bs-app/node_modules/core-js-pure
> node -e "try{require('./postinstall')}catch(e){}"

+ cra-template-brightsign-app@1.0.0
+ react-scripts@5.0.1
+ react@18.3.1
+ react-dom@18.3.1
added 1503 packages from 653 contributors in 71.567s

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


Initialized a git repository.

Installing template dependencies using npm...
npm ERR! code ETARGET
npm ERR! notarget No matching version found for nvm@^0.39.1.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/[MYUSERNAME]/.npm/_logs/2024-05-20T11_41_20_826Z-debug.log
`npm install --no-audit --save node@^14.17.6 nvm@^0.39.1 @babel/core@^7.23.0 @babel/preset-env@^7.22.20 @babel/preset-react@^7.23.3 @webpack-cli/generators@^3.0.2 babel-loader@^9.1.3 html-webpack-plugin@^5.5.3 css-loader@^6.10.0 style-loader@^3.3.4 webpack@^5.82.0 webpack-cli@^5.1.0 @testing-library/jest-dom@^6.4.2 @testing-library/react@^14.2.2` failed

errors after running yarn in bs-app

[3/5] Fetching packages...
error workbox-webpack-plugin@6.6.1: The engine "node" is incompatible with this module. Expected version ">=16.0.0". Got "14.17.6"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

Brightsign logs

   14.896] JS.Supervisor : Service rollback : Loading version {"major":1,"minor":0,"patch":0} (Standalone)
[   14.950] 
[   14.950] (electron:2918): Gtk-WARNING **: 04:47:14.333: Could not find the icon 'window-minimize-symbolic-ltr'. The 'hicolor' theme
[   14.950] was not found either, perhaps you need to install it.
[   14.950] You can get a copy from:
[   14.950] 	http://icon-theme.freedesktop.org/releases
[   14.965] JS.system rollback : INFO Retrieving rollback state
[   14.967] JS.Bootstrap : INFO Supervisor is now invoking autorun.
[   14.984] JS.Supervisor : INFO Launched all services in step 6 with success
[   14.984] JS.Bootstrap : INFO Supervisor, /opt/roku/sys/supervisors/2024-02-09T19-43-15.898Z/2024-02-09T19-43-15.898Z.js (v 2.1.15) :  is HAPPY
[   14.985] JS.Bootstrap : INFO Writing last tried entry of <empty>
[   15.032] Setting system clock to 1716205634.000000
[   15.034] NetworkTime: clock set to 2024/05/20 11:47:14.001 UTC
[   15.068] [2918:0520/044714.036379:ERROR:bus.cc(399)] Failed to connect to the bus: Could not parse server address: Unknown address type (examples of valid types are "tcp" and on UNIX "unix")
[   15.069] [2918:0520/044714.036450:ERROR:bus.cc(399)] Failed to connect to the bus: Could not parse server address: Unknown address type (examples of valid types are "tcp" and on UNIX "unix")
[   15.114] JS.Configure-connection : INFO No payload processing required
[   15.139] JS.Channel-BSN: INFO Received message: sys.network.boot.connected
[   15.139] JS.Channel-BSN: INFO Received sys.network.boot.connected
[   15.139] JS.player-register : INFO Received a network connection, try registration
[   15.139] JS.player-register : INFO Websocket has not open yet. Do not trigger registration request
[   15.139] JS.player-status : INFO Received sys.network.boot.connected
[   15.140] JS.Channel-BSN: ERROR checkWebSocketStability has failed. Attempting to restart websockets.
[   15.141] JS.Channel-BSN: INFO BSN.cloud is enabled; New Local DWS is enabled, Remote DWS is enabled
[   15.143] JS.websocket-player : INFO Creating WS listener
[   15.536] 2024-05-20 04:47:14:4714 �[32minfo�[39m: �[32mgRPC server started on: unix:///tmp/50051.sock�[39m
[   15.552] Loading 'SD:/autorun.brs' (8a88065217746ed2f83926fd762887d252f1439f)
[   15.604] 
[   15.604] DevTools listening on ws://0.0.0.0:2999/devtools/browser/2eefb7f3-da64-48f3-ad82-6b0bd0d36ca8
[   16.016] JS.AutoUpgrade : INFO This firmware supports 0 different supervisors.
[   16.069] Autorun.payload-cellular : INFO Did not find any active supported modems
[   16.443] JS.websocket-player : INFO { 2024-05-20T11:47:15.410Z} WS connection open
[   16.444] JS.player-register : INFO Received a websocket connection, try registration
[   16.448] JS.player-register : INFO checkForRegistration: Cannot find a registration token
[   16.662] [2918:0520/044715.629508:ERROR:nss_util.cc(55)] Failed to create /.pki/nssdb directory.
[   16.734] __do_sys_close: 1947 callbacks suppressed
[   16.734] 32JS_IPCBrights(3126):close(1023) returning EBADF
[   16.782] Starting inspector on 0.0.0.0:2999 failed: address already in use
[   16.976] Server running on port 8020
[   17.708] 2024-05-20 04:47:16:4716 �[31merror�[39m: �[31m(node:2918) electron: Failed to load URL: http://localhost:8020/ with error: ERR_CONNECTION_REFUSED�[39m
[   17.708] �[31m(Use `electron --trace-warnings ...` to show where the warning was created)�[39m
[   17.863] [WARN]   [source node:electron/js2c/renderer_init:2]: %cElectron Security Warning (Insecure Content-Security-Policy) font-weight: bold; This renderer process has either no Content Security
[   17.863]   Policy set or a policy with "unsafe-eval" enabled. This exposes users of
[   17.863]   this app to unnecessary security risks.
[   17.863] 
[   17.863] For more information and help, consult
[   17.863] https://electronjs.org/docs/tutorial/security.
[   17.863] This warning will not show up
[   17.863] once the app is packaged. 
[   22.500] "Storage could not getDeviceHealth: Storage card not found"
[   22.501] "Caught exception while getting storage info: Cannot set property 'percentageHealthUsed' of undefined"
[   22.633] __do_sys_close: 949 callbacks suppressed
[   22.633] 18JS_IPCDeviceS(3187):close(1023) returning EBADF
[   22.643] SignalDispatcher received signal 17
[   24.127] 
[   32.483] "Storage could not getDeviceHealth: Storage card not found"
[   32.483] "Caught exception while getting storage info: Cannot set property 'percentageHealthUsed' of undefined"
[   32.633] __do_sys_close: 947 callbacks suppressed
[   32.633] 18JS_IPCDeviceS(3235):close(1023) returning EBADF
[   32.643] SignalDispatcher received signal 17
[   33.926] 
[   42.236] "Storage could not getDeviceHealth: Storage card not found"
[   42.236] "Caught exception while getting storage info: Cannot set property 'percentageHealthUsed' of undefined"
[   42.277] __do_sys_close: 964 callbacks suppressed
[   42.277] 18JS_IPCDeviceS(3282):close(1023) returning EBADF
[   42.286] SignalDispatcher received signal 17

[aleBranching]

This fix fixed bs-app not working but the bs-dashoard still doesn't work. I can not get the chrome inspector going on the bs-dashboard. While for bs-app inspector work fine now and the website itself displays fine now.

[jdmedlin1]

@aleBranching, thank you for your patience and help identifying this issue. We have made some changes based on your filed issue. Please let us know if you still incur problems.