383ace4d7e
In union option groups, the list of selected ids is encoded as a comma-delimited string. For example, if 'foo' and 'bar' are selected, the value 'foo,bar' is sent, ie ["foo", "bar"] -> "foo,bar" Under this scheme, with nothing selected, the empty string should be sent, ie. [] -> "" Before this change, the frontend code called the "none option" by id 'none'. There were several issues with this: * The frontend would send 'none' when nothing was selected, not ''. The backend ignored this as it ignores junk values in the options, treating them as though they hadn't been given. * The backend would attempt to set the default value of an option to "nothing selected", ie. [], by sending ''. The frontend would interpret this as nothing selected, *not even the 'none' option*, which caused a visual bug. * Everything would break if one of the legitimate options had the id 'none', which could easily happen eg. if a user had a 'none' k8s namespace. This is perhaps an unusual name, but our code shouldn't break when a particular arbitary string is used as an input. With this change, the none option is called '', which fixes all the above problems: * The frontend encodes [''] as '' * The frontend decodes '' as [''], and therefore shows the '' option as selected * The string '' is not a valid k8s namespace name and is a reasonable "prohibited value" for all other use cases. The backend already couldn't handle a value with this id correctly prior to this change anyway.
Scope UI
Getting Started (using local node)
- You need at least Node.js 6.9.0 and a running
weavescopecontainer - Setup:
npm install - Develop:
BACKEND_HOST=<dockerhost-ip> npm startand then openhttp://localhost:4042/
This will start a webpack-dev-server that serves the UI and proxies API requests to the container.
Getting Started (using node in a container)
- You need a running
weavescopecontainer - Develop:
make WEBPACK_SERVER_HOST=<dockerhost-ip> client-startand then openhttp://<dockerhost-ip>:4042/
This will start a webpack-dev-server that serves the UI from the UI build container and proxies API requests to the weavescope container.
Test Production Bundles Locally
- Build:
npm run build, output will be inbuild/ - Serve files from
build/:BACKEND_HOST=<dockerhost-ip> npm run start-productionand then openhttp://localhost:4042/
Coding
This directory has a .eslintrc, make sure your editor supports linter hints.
To run a linter, you also run npm run lint.
Logging
To enable logging in the console, activate it via localStorage in the dev tools console:
localStorage["debug"] = "scope:*"
The Scope UI uses debug for logging, e.g.,:
const debug = require('debug')('scope:app-store');
debug('Store log message');
Gotchas
Got a blank screen when loading http://localhost:4042?
Make sure you are accessing the right machine:
If you're running npm start on a virtual machine with IP 10.0.0.8, you need to point your browser to http://10.0.0.8:4042.
Also, you may need to manually configure the virtual machine to expose ports 4041 (webpack-dev-server) and 4042 (express proxy).