consul/ui-v2
John Cowen 06b6aff8d0 ui: CSS Components Migration (#5913)
Migrate roughly half of the base components into base
Adds a target for easily formatting CSS

Further CSS amends/migration (#5921)

1. tooltips within tables where a slightly bit troublesome due to a mix
of `inline-flex`, `overflow` and the need for truncation. This refineds
tooltips a slight bit more to work 'everywhere'.
2. We also move tooltip to use the correct color and min-width from
structure, but we overwrite the min-width here until we get confirmation
on widths/alignment of text within a tooltip.
3. Tiny fixes for breadcrumbs and toggle-buttons in tabular listings
4. Now we inline-flex our table cells, it means it is impossible to
truncate text without wrapping it in another element. This wraps all
Description like text in `<p>` tags. Generally the first column of text
is already wrapped in an `<a>` tag. Other items such as consul tags and
policy names etc get 'cutoff' rather than truncated.
5. We are now using all the icons from `@hashicorp/structure-icons`
2019-09-04 08:35:01 +00:00
..
app ui: CSS Components Migration (#5913) 2019-09-04 08:35:01 +00:00
config ui: Allow text selection of clickable elements and their contents (#5770) 2019-09-04 08:34:58 +00:00
lib ui: modify content path (#5950) 2019-06-26 11:43:30 -05:00
public ui: serve /robots.txt when UI is enabled. (#5089) 2018-12-17 19:35:03 +01:00
tests ui: Adds ember-auto-import and replaces the 3 places where we used npm: (#5952) 2019-09-04 08:35:00 +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 Move testing doubles to use data embedded in the HTML vs HTTP/fetch 2018-07-02 19:02:16 +01:00
.eslintignore UI: Add EventSource ready for implementing blocking queries (#5070) 2019-05-01 18:22:06 +00:00
.eslintrc.js UI V2 (#4086) 2018-05-10 19:52:53 +01:00
.gitignore WIP: Feature/acceptance tests 2018-06-12 11:24:35 +01:00
.nvmrc UI V2 (#4086) 2018-05-10 19:52:53 +01:00
.prettierrc UI V2 (#4086) 2018-05-10 19:52:53 +01:00
.watchmanconfig UI V2 (#4086) 2018-05-10 19:52:53 +01:00
GNUmakefile ui: modify content path (#5950) 2019-06-26 11:43:30 -05:00
README.md add documentation on how to use ember-exam 2019-01-03 23:50:02 -05:00
ember-cli-build.js ui: Rename extended Component variables, tweak some comments (#5021) 2019-05-01 18:21:50 +00:00
package.json ui: CSS Components Migration (#5913) 2019-09-04 08:35:01 +00:00
testem.js output XML test results 2019-01-03 22:21:19 -05:00
yarn.lock ui: Adds ember-auto-import and replaces the 3 places where we used npm: (#5952) 2019-09-04 08:35:00 +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

Running / Development

The source code comes with a small server 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.

  • make start-api or yarn start:api (this starts a Consul API double running on http://localhost:3000)
  • make start or yarn start to start the ember app that connects to the above API double
  • Visit your app at http://localhost:4200.

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.

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

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:

yarn test-parallel

To run manually:

$ EMBER_EXAM_PARALLEL=true ember exam --split <num> --parallel

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