466c3c6899
* ui: Allow text selection of clickable elements and their contents This commit disables a click on mousedown be removing the `href` attribute and moving it to a `data-href` attribute. On mouseup it will only move it back if there is no selection. This means that an anchor will only be followed on click _if_ there is no selection. This fixes the fact that whenever you select some copy within a clickable element it immediately throws you into the linked page when you release your mouse. Further notes: We use the `isCollapsed` property here which 'seems' to be classed as 'experimental' in one place where I researched it: https://developer.mozilla.org/en-US/docs/Web/API/Selection/isCollapsed Although in others it makes no mention of this 'experimental' e.g: - https://webplatform.github.io/docs/dom/Selection/isCollapsed/ - https://w3c.github.io/selection-api/#dom-selection-iscollapsed I may have gone a little overboard in feature detection for this, but I conscious of that fact that if `isCollapsed` doesn't exist at some point in the future (something that seems unlikely). The code here will have no effect on the UI. But I'd specifically like a second pair of eyes on that. * ui: Don't break right click, detects a secondary click on mousedown * ui: Put anchor selection capability behind an ENV var |
||
|---|---|---|
| .. | ||
| app | ||
| config | ||
| lib | ||
| public | ||
| tests | ||
| .dev.eslintrc.js | ||
| .editorconfig | ||
| .ember-cli | ||
| .eslintignore | ||
| .eslintrc.js | ||
| .gitignore | ||
| .nvmrc | ||
| .prettierrc | ||
| .watchmanconfig | ||
| GNUmakefile | ||
| README.md | ||
| ember-cli-build.js | ||
| package.json | ||
| testem.js | ||
| yarn.lock | ||
README.md
consul-ui
Prerequisites
You will need the following things properly installed on your computer.
- Git
- Node.js (with npm)
- yarn
- Ember CLI
- Google Chrome
Installation
git clone https://github.com/hashicorp/consul.gitthis repositorycd ui-v2yarn 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-apioryarn start:api(this starts a Consul API double running on http://localhost:3000)make startoryarn startto 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 testoryarn run testmake test-vieworyarn run test:viewto 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.