consul/ui-v2
John Cowen 468e82dcf9
ui: Alter position of logic for showing the Round Trip Time tab to prevent DOM refresh (#7377)
* ui: Move tomography length check inside of the partial

Previously we checked the length of tomography.distances to decide
whether to show the RTT tab or not. Previous to our ember upgrade this
would not cause a DOM reload of so many elements (i.e. all of the tab
content). Since our ember upgrade, any change to tomography (so not
necessarily the length of distances) seems to fire a change to the length (even if
the length remains the same). The knock on effect of this is that the
array of tab panels seems to be recalculated (but remain the same) and
all of the tab panels are completely re-rendered, causing the scroll of
the page to be reset.

This commit moves the check for tomography.distance.length to the lower
down with the loop, which means the array of tab panels always remains
the same, which consequently means that the entire array of tab panels
is never re-rendered entirely, and therefore fixes the issue.
2020-03-04 18:12:27 +00:00
..
app ui: Alter position of logic for showing the Round Trip Time tab to prevent DOM refresh (#7377) 2020-03-04 18:12:27 +00:00
blueprints ui: Adds ember-data blueprints for Consul specific HTTP adapter etc (#6461) 2019-12-18 12:26:42 +00:00
config ui: Run 2 separate test runs oss and ent (#7214) 2020-02-07 11:02:53 +00:00
lib ui: Move slots to use attributes over positional params (#7032) 2020-01-15 09:15:54 +00:00
node-tests/config ui: Run 2 separate test runs oss and ent (#7214) 2020-02-07 11:02:53 +00:00
public ui: serve /robots.txt when UI is enabled. (#5089) 2018-12-17 19:35:03 +01:00
tests ui: Gracefully cope with 500 errors from the disco-chain API endpoint (#7291) 2020-02-14 14:46:16 +00:00
.dev.eslintrc.js UI V2 (#4086) 2018-05-10 19:52:53 +01:00
.editorconfig UI V2 (#4086) 2018-05-10 19:52:53 +01:00
.ember-cli ui: [dev] Adds express middleware, removes need to run api dev server (#6750) 2019-12-18 12:26:41 +00:00
.eslintignore ui: UI Release Merge (ui-staging merge) (#6527) 2019-09-30 14:47:49 +01:00
.eslintrc.js ui: UI Release Merge (ui-staging merge) (#6527) 2019-09-30 14:47:49 +01:00
.gitignore ui: UI Release Merge (ui-staging merge) (#6527) 2019-09-30 14:47:49 +01:00
.nvmrc ui: Upgrade tooling to node 10 now we are on a more recent ember (#6610) 2019-12-18 12:26:40 +00:00
.prettierrc UI V2 (#4086) 2018-05-10 19:52:53 +01:00
.template-lintrc.js ui: UI Release Merge (ui-staging merge) (#6527) 2019-09-30 14:47:49 +01:00
.watchmanconfig UI V2 (#4086) 2018-05-10 19:52:53 +01:00
GNUmakefile ui: Run 2 separate test runs oss and ent (#7214) 2020-02-07 11:02:53 +00:00
README.md ui: [dev] Adds express middleware, removes need to run api dev server (#6750) 2019-12-18 12:26:41 +00:00
_redirects ui: Netlify previews (#6419) 2019-09-04 08:35:17 +00:00
ember-cli-build.js ui: Discovery Chain (#6746) 2019-12-18 12:26:47 +00:00
package.json ui: Run 2 separate test runs oss and ent (#7214) 2020-02-07 11:02:53 +00:00
testem.js ui: UI Release Merge (ui-staging merge) (#6527) 2019-09-30 14:47:49 +01:00
yarn.lock ui: Discovery chain improvements (#7222) 2020-02-06 12:06:47 +00:00

README.md

consul-ui

Prerequisites

You will need the following things properly installed on your computer.

Installation

  • git clone https://github.com/hashicorp/consul.git this repository
  • cd ui-v2
  • yarn install

All tooling scripts below primarily use make which in turn call node package scripts.

Running / Development

The source code comes with a small development mode that runs enough of the consul API as a set of mocks/fixtures to be able to run the UI without having to run consul.

To enable ACLs using the mock API, use Web Inspector to set a cookie as follows:

CONSUL_ACLS_ENABLE=1

This will enable the ACLs login page, to which you can login with any ACL token/secret.

You can also use a number of other cookie key/values to set various things whilst developing the UI, such as (but not limited to):

CONSUL_SERVICE_COUNT=1000
CONSUL_NODE_CODE=1000
// etc etc

See ./node_modules/@hashicorp/consul-api-double for more details.

If you wish to run the UI code against a running consul instance, uncomment the proxy line in .ember-cli to point ember-cli to your consul instance.

You can also run the UI against a normal Consul installation.

make start-consul or yarn run start:consul will use the CONSUL_HTTP_ADDR environment variable to locate the Consul installation. If that it not set start-consul will use http://localhost:8500.

Example usage:

CONSUL_HTTP_ADDR=http://10.0.0.1:8500 make start-consul

Code Generators

Make use of the many generators for code, try ember help generate for more details

Running Tests

Please note: You do not need to run make start-api/yarn run start:api to run the tests, but the same mock consul API is used.

  • make test or yarn run test
  • make test-view or yarn run test:view to view the tests running in Chrome

Linting

make lint currently runs linting on the majority of js files and hbs files (using ember-template-lint).

See .eslintrc.js and .eslintignore for specific configuration.

Building

  • make build builds the UI for production usage (env=production)
  • make build-ci builds the UI for CI/test usage (env=test)

Static files are built into ./dist

Running Tests in Parallel

Alternatively, ember-exam can be used to split the tests across multiple browser instances for faster results. Most options are the same as ember test. To see a full list of options, run ember exam --help.

Note: The EMBER_EXAM_PARALLEL environment variable must be set to override the default parallel value of 1 browser instance in testem.js.

To quickly run the tests across 4 parallel browser instances:

make test-parallel

To run manually:

$ EMBER_EXAM_PARALLEL=true ./node_modules/.bin/ember exam --split <num> --parallel

More ways to split tests can be found in the ember-exam README.md.