add some ui development tips

This commit is contained in:
Mahmood Ali 2019-09-17 08:38:11 -04:00
parent e33437635d
commit f82f45c026
1 changed files with 13 additions and 5 deletions

View File

@ -6,10 +6,9 @@ The official Nomad UI.
This is an [ember.js](https://emberjs.com/) project, and you will need the following tools installed on your computer.
* [Node.js](https://nodejs.org/)
* [Node.js v10](https://nodejs.org/)
* [Yarn](https://yarnpkg.com)
* [Ember CLI](https://ember-cli.com/)
* [PhantomJS](http://phantomjs.org/) (for running tests)
## Installation
@ -22,11 +21,13 @@ $ yarn
## Running / Development
First, make sure nomad is running. The UI, in development mode, runs independently from Nomad, so this could be an official release or a dev branch. Likewise, Nomad can be running in server mode or dev mode. As long as the API is accessible, the UI will work as expected.
UI in development mode defaults to using fake generated data, but you can configure it to proxy a live running nomad process by setting `USE_MIRAGE` environment variable to `false`. First, make sure nomad is running. The UI, in development mode, runs independently from Nomad, so this could be an official release or a dev branch. Likewise, Nomad can be running in server mode or dev mode. As long as the API is accessible, the UI will work as expected.
* `ember serve`
* `USE_MIRAGE=false ember serve`
* Visit your app at [http://localhost:4200](http://localhost:4200).
You may need to reference the direct path to `ember`, typically in `./node_modules/.bin/ember`.
## Running / Development with Vagrant
All necessary tools for UI development are installed as part of the Vagrantfile. This is primarily to make it easy to build the UI from source while working on Nomad. Due to the filesystem requirements of [Broccoli](http://broccolijs.com/) (which powers Ember CLI), it is strongly discouraged to use Vagrant for developing changes to the UI.
@ -49,6 +50,7 @@ Nomad UI tests can be run independently of Nomad golang tests.
* `ember test` (single run, headless browser)
* `ember test --server` (watches for changes, runs in a full browser)
You can use `--filter <test name>` to run a targetted set of tests, e.g. `ember test --filter 'allocation detail'`.
### Linting
@ -70,11 +72,17 @@ Typically `make release` or `make dev-ui` will be the desired build workflow, bu
Nomad UI releases are in lockstep with Nomad releases and are integrated into the `make release` toolchain.
### Conventions
* UI branches should be prefix with `f-ui-` for feature work and `b-ui-` for bug fixes. This instructs CI to skip running nomad backend tests.
### Troubleshooting
#### The UI is running, but none of the API requests are working
By default (according to the `.embercli` file) a proxy address of `http://localhost:4646` is used. If you are running Nomad at a different address, you will need to override this setting when running ember serve: `ember serve --proxy http://newlocation:1111`.
By default (according to the `.ember-cli` file), a proxy address of `http://localhost:4646` is used. If you are running Nomad at a different address, you will need to override this setting when running ember serve: `ember serve --proxy http://newlocation:1111`.
Also, ensure that `USE_MIRAGE` environment variable is set to false, so the UI proxy requests to Nomad process instead of using autogenerated test data.
#### Nomad is running in Vagrant, but I can't access the API from my host machine