From 2179bb0decc107c0a80a2bf25e600bcae58b5c74 Mon Sep 17 00:00:00 2001 From: Kenia <19161242+kaxcode@users.noreply.github.com> Date: Wed, 29 Jul 2020 09:41:40 -0400 Subject: [PATCH] ui: Add sorting to ACLs tokens with tests (#8359) * Add sorting to ACLs tokens with tests * Create token comparator and implement in template * Upgrade @hashicorp/consul-api-double to 3.1.6 * Add navigation test to acls tokens --- .../components/consul-token-list/index.hbs | 2 +- .../consul-token-list/pageobject.js | 2 +- .../app/components/list-collection/index.hbs | 39 ++++++++++--------- ui-v2/app/controllers/dc/acls/tokens/index.js | 1 + ui-v2/app/initializers/sort.js | 2 + ui-v2/app/routes/dc/acls/tokens/index.js | 1 + ui-v2/app/sort/comparators/token.js | 3 ++ ui-v2/app/styles/components/notice.scss | 2 +- ui-v2/app/templates/dc/acls/tokens/index.hbs | 28 ++++++++++--- .../dc/acls/tokens/navigation.feature | 15 +++++++ .../acceptance/dc/acls/tokens/sorting.feature | 39 +++++++++++++++++++ .../tests/acceptance/page-navigation.feature | 3 +- .../steps/dc/acls/tokens/navigation-steps.js | 10 +++++ .../steps/dc/acls/tokens/sorting-steps.js | 10 +++++ ui-v2/tests/pages.js | 2 +- ui-v2/tests/pages/dc/acls/tokens/index.js | 4 +- ui-v2/yarn.lock | 6 +-- 17 files changed, 134 insertions(+), 35 deletions(-) create mode 100644 ui-v2/app/sort/comparators/token.js create mode 100644 ui-v2/tests/acceptance/dc/acls/tokens/navigation.feature create mode 100644 ui-v2/tests/acceptance/dc/acls/tokens/sorting.feature create mode 100644 ui-v2/tests/acceptance/steps/dc/acls/tokens/navigation-steps.js create mode 100644 ui-v2/tests/acceptance/steps/dc/acls/tokens/sorting-steps.js diff --git a/ui-v2/app/components/consul-token-list/index.hbs b/ui-v2/app/components/consul-token-list/index.hbs index cdf2509ba8..40160cca7d 100644 --- a/ui-v2/app/components/consul-token-list/index.hbs +++ b/ui-v2/app/components/consul-token-list/index.hbs @@ -10,7 +10,7 @@ {{/if}} - {{substr item.AccessorID -8}} + {{substr item.AccessorID -8}}
diff --git a/ui-v2/app/components/consul-token-list/pageobject.js b/ui-v2/app/components/consul-token-list/pageobject.js index ba09453859..1068f135d3 100644 --- a/ui-v2/app/components/consul-token-list/pageobject.js +++ b/ui-v2/app/components/consul-token-list/pageobject.js @@ -1,5 +1,5 @@ export default (collection, clickable, attribute, text, actions) => () => { - return collection('.consul-token-list li:not(:first-child)', { + return collection('.consul-token-list [data-test-list-row]', { id: attribute('data-test-token', '[data-test-token]'), description: text('[data-test-description]'), policy: text('[data-test-policy].policy', { multiple: true }), diff --git a/ui-v2/app/components/list-collection/index.hbs b/ui-v2/app/components/list-collection/index.hbs index cb41866040..00e20b5851 100644 --- a/ui-v2/app/components/list-collection/index.hbs +++ b/ui-v2/app/components/list-collection/index.hbs @@ -9,25 +9,26 @@ @clientSizeChange={{action "clientSizeChange"}} >
  • - {{~#each _cells as |cell|~}} -
  • +
    {{yield cell.item cell.index}}
     +
    {{yield cell.item cell.index}}
     + -
    {{yield cell.item cell.index}}
     -
    {{yield cell.item cell.index}}
     - -
    - {{yield cell.item cell.index}} -
    -     -
    • - {{~/each~}} +
    + {{yield cell.item cell.index}} +
    + + + {{~/each~}} \ No newline at end of file diff --git a/ui-v2/app/controllers/dc/acls/tokens/index.js b/ui-v2/app/controllers/dc/acls/tokens/index.js index 510563886b..f99cde37f3 100644 --- a/ui-v2/app/controllers/dc/acls/tokens/index.js +++ b/ui-v2/app/controllers/dc/acls/tokens/index.js @@ -1,6 +1,7 @@ import Controller from '@ember/controller'; export default Controller.extend({ queryParams: { + sortBy: 'sort', search: { as: 'filter', replace: true, diff --git a/ui-v2/app/initializers/sort.js b/ui-v2/app/initializers/sort.js index 464abe4d18..7b9159df92 100644 --- a/ui-v2/app/initializers/sort.js +++ b/ui-v2/app/initializers/sort.js @@ -1,6 +1,7 @@ import service from 'consul-ui/sort/comparators/service'; import check from 'consul-ui/sort/comparators/check'; import intention from 'consul-ui/sort/comparators/intention'; +import token from 'consul-ui/sort/comparators/token'; export function initialize(container) { // Service-less injection using private properties at a per-project level @@ -9,6 +10,7 @@ export function initialize(container) { service: service(), check: check(), intention: intention(), + token: token(), }; Sort.reopen({ comparator: function(type) { diff --git a/ui-v2/app/routes/dc/acls/tokens/index.js b/ui-v2/app/routes/dc/acls/tokens/index.js index 075d738b3a..0b650963a2 100644 --- a/ui-v2/app/routes/dc/acls/tokens/index.js +++ b/ui-v2/app/routes/dc/acls/tokens/index.js @@ -7,6 +7,7 @@ export default Route.extend(WithTokenActions, { repo: service('repository/token'), settings: service('settings'), queryParams: { + sortBy: 'sort', search: { as: 'filter', replace: true, diff --git a/ui-v2/app/sort/comparators/token.js b/ui-v2/app/sort/comparators/token.js new file mode 100644 index 0000000000..62e718f7a1 --- /dev/null +++ b/ui-v2/app/sort/comparators/token.js @@ -0,0 +1,3 @@ +export default () => key => { + return key; +}; diff --git a/ui-v2/app/styles/components/notice.scss b/ui-v2/app/styles/components/notice.scss index ee025c83b6..9474ab4a4a 100644 --- a/ui-v2/app/styles/components/notice.scss +++ b/ui-v2/app/styles/components/notice.scss @@ -1,5 +1,5 @@ %notice { - margin-bottom: 1em; + margin: 1em 0; } %notice-success::before { @extend %with-check-circle-fill-color-icon; diff --git a/ui-v2/app/templates/dc/acls/tokens/index.hbs b/ui-v2/app/templates/dc/acls/tokens/index.hbs index 60dd60f26f..5bbcd03ee6 100644 --- a/ui-v2/app/templates/dc/acls/tokens/index.hbs +++ b/ui-v2/app/templates/dc/acls/tokens/index.hbs @@ -3,6 +3,14 @@ {{else}} {{title 'Access Controls'}} {{/if}} + +{{#let (selectable-key-values + (array "CreateTime:desc" "Newest to oldest") + (array "CreateTime:asc" "Oldest to newest") + selected=sortBy + ) + as |sort| +}} Create - -{{#if (gt items.length 0) }} + + {{#if (gt items.length 0)}} -{{/if}} + {{/if}} + + {{#if (token/is-legacy items)}}

    Update. We have upgraded our ACL System to allow the creation of reusable policies that can be applied to tokens. Read more about the changes and how to upgrade legacy tokens in our documentation.

    {{/if}} - + {{#let (sort-by (comparator 'token' sort.selected.key) items) as |sorted|}} + + {{/let}}     +{{/let}} diff --git a/ui-v2/tests/acceptance/dc/acls/tokens/navigation.feature b/ui-v2/tests/acceptance/dc/acls/tokens/navigation.feature new file mode 100644 index 0000000000..b05e3ba7a3 --- /dev/null +++ b/ui-v2/tests/acceptance/dc/acls/tokens/navigation.feature @@ -0,0 +1,15 @@ +@setupApplicationTest +Feature: dc / tokens / navigation + Scenario: Clicking a token in the listing and back again + Given 1 datacenter model with the value "dc-1" + And 3 token models + When I visit the tokens page for yaml + --- + dc: dc-1 + --- + Then the url should be /dc-1/acls/tokens + And the title should be "Tokens - Consul" + Then I see 3 token models + When I click token on the tokens + And I click "[data-test-back]" + Then the url should be /dc-1/acls/tokens diff --git a/ui-v2/tests/acceptance/dc/acls/tokens/sorting.feature b/ui-v2/tests/acceptance/dc/acls/tokens/sorting.feature new file mode 100644 index 0000000000..5b97b72b39 --- /dev/null +++ b/ui-v2/tests/acceptance/dc/acls/tokens/sorting.feature @@ -0,0 +1,39 @@ +@setupApplicationTest +Feature: dc / acls / tokens / sorting + Scenario: Sorting Tokens + Given 1 datacenter model with the value "dc-1" + And 4 token models from yaml + --- + - AccessorID: "00000000-0000-0000-0000-000000000001" + CreateTime: "2018-09-15T11:58:09.197Z" + - AccessorID: "00000000-0000-0000-0000-000000000002" + CreateTime: "2020-09-15T11:58:09.197Z" + - AccessorID: "00000000-0000-0000-0000-000000000003" + CreateTime: "2007-09-15T11:58:09.197Z" + - AccessorID: "00000000-0000-0000-0000-000000000004" + CreateTime: "2011-09-15T11:58:09.197Z" + --- + When I visit the tokens page for yaml + --- + dc: dc-1 + --- + Then the url should be /dc-1/acls/tokens + Then I see 4 token models + When I click selected on the sort + When I click options.1.button on the sort + Then I see id on the tokens vertically like yaml + --- + - "00000000-0000-0000-0000-000000000003" + - "00000000-0000-0000-0000-000000000004" + - "00000000-0000-0000-0000-000000000001" + - "00000000-0000-0000-0000-000000000002" + --- + When I click selected on the sort + When I click options.0.button on the sort + Then I see id on the tokens vertically like yaml + --- + - "00000000-0000-0000-0000-000000000002" + - "00000000-0000-0000-0000-000000000001" + - "00000000-0000-0000-0000-000000000004" + - "00000000-0000-0000-0000-000000000003" + --- \ No newline at end of file diff --git a/ui-v2/tests/acceptance/page-navigation.feature b/ui-v2/tests/acceptance/page-navigation.feature index c2648c77b3..0982c742ff 100644 --- a/ui-v2/tests/acceptance/page-navigation.feature +++ b/ui-v2/tests/acceptance/page-navigation.feature @@ -46,8 +46,7 @@ Feature: page-navigation | node | nodes | /dc-1/nodes/node-0/health-checks | /v1/session/node/node-0?dc=dc-1&ns=@namespace | /dc-1/nodes | | kv | kvs | /dc-1/kv/0-key-value/edit | /v1/session/info/ee52203d-989f-4f7a-ab5a-2bef004164ca?dc=dc-1&ns=@namespace | /dc-1/kv | # | acl | acls | /dc-1/acls/anonymous | /v1/acl/info/anonymous?dc=dc-1 | /dc-1/acls | -# These Endpoints will be datacenters due to the datacenters checkbox selectors - | token | tokens | /dc-1/acls/tokens/ee52203d-989f-4f7a-ab5a-2bef004164ca | /v1/catalog/datacenters | /dc-1/acls/tokens | +# These Endpoints will be datacenters due to the datacenters checkbox selectors | /dc-1/acls/tokens | | policy | policies | /dc-1/acls/policies/ee52203d-989f-4f7a-ab5a-2bef004164ca | /v1/catalog/datacenters | /dc-1/acls/policies | # | token | tokens | /dc-1/acls/tokens/00000000-0000-0000-0000-000000000000 | /v1/acl/token/00000000-0000-0000-0000-000000000000?dc=dc-1 | /dc-1/acls/tokens | # | policy | policies | /dc-1/acls/policies/ee52203d-989f-4f7a-ab5a-2bef004164ca | /v1/acl/policy/ee52203d-989f-4f7a-ab5a-2bef004164ca?dc=dc-1 | /dc-1/acls/policies | diff --git a/ui-v2/tests/acceptance/steps/dc/acls/tokens/navigation-steps.js b/ui-v2/tests/acceptance/steps/dc/acls/tokens/navigation-steps.js new file mode 100644 index 0000000000..3231912b98 --- /dev/null +++ b/ui-v2/tests/acceptance/steps/dc/acls/tokens/navigation-steps.js @@ -0,0 +1,10 @@ +import steps from '../../../steps'; + +// step definitions that are shared between features should be moved to the +// tests/acceptance/steps/steps.js file + +export default function(assert) { + return steps(assert).then('I should find a file', function() { + assert.ok(true, this.step); + }); +} diff --git a/ui-v2/tests/acceptance/steps/dc/acls/tokens/sorting-steps.js b/ui-v2/tests/acceptance/steps/dc/acls/tokens/sorting-steps.js new file mode 100644 index 0000000000..3231912b98 --- /dev/null +++ b/ui-v2/tests/acceptance/steps/dc/acls/tokens/sorting-steps.js @@ -0,0 +1,10 @@ +import steps from '../../../steps'; + +// step definitions that are shared between features should be moved to the +// tests/acceptance/steps/steps.js file + +export default function(assert) { + return steps(assert).then('I should find a file', function() { + assert.ok(true, this.step); + }); +} diff --git a/ui-v2/tests/pages.js b/ui-v2/tests/pages.js index 3060bc11bf..af64436c8b 100644 --- a/ui-v2/tests/pages.js +++ b/ui-v2/tests/pages.js @@ -164,7 +164,7 @@ export default { roles: create(roles(visitable, creatable, consulRoleList, freetextFilter)), // TODO: This needs a policyList role: create(role(visitable, submitable, deletable, cancelable, policySelector, tokenList)), - tokens: create(tokens(visitable, creatable, text, consulTokenList, freetextFilter)), + tokens: create(tokens(visitable, creatable, text, consulTokenList, popoverSelect)), token: create( token(visitable, submitable, deletable, cancelable, clickable, policySelector, roleSelector) ), diff --git a/ui-v2/tests/pages/dc/acls/tokens/index.js b/ui-v2/tests/pages/dc/acls/tokens/index.js index 49f77fff1b..b08510794c 100644 --- a/ui-v2/tests/pages/dc/acls/tokens/index.js +++ b/ui-v2/tests/pages/dc/acls/tokens/index.js @@ -1,9 +1,9 @@ -export default function(visitable, creatable, text, tokens, filter) { +export default function(visitable, creatable, text, tokens, popoverSelect) { return { visit: visitable('/:dc/acls/tokens'), update: text('[data-test-notification-update]'), tokens: tokens(), - filter: filter(), + sort: popoverSelect(), ...creatable(), }; } diff --git a/ui-v2/yarn.lock b/ui-v2/yarn.lock index 86567586cd..05d2bea0f9 100644 --- a/ui-v2/yarn.lock +++ b/ui-v2/yarn.lock @@ -1223,9 +1223,9 @@ js-yaml "^3.13.1" "@hashicorp/consul-api-double@^3.0.0": - version "3.1.3" - resolved "https://registry.yarnpkg.com/@hashicorp/consul-api-double/-/consul-api-double-3.1.3.tgz#62f8780c8513e9b37f29302543c29143b4024141" - integrity sha512-IZ90RK8g4/QPxQpRLnatwpBQh9Z3kQJjOGiUVz+CrSlXg4KRLhQCFFz/gI2vmhAXRACyTxIWuydPV6BcN4ptZA== + version "3.1.6" + resolved "https://registry.yarnpkg.com/@hashicorp/consul-api-double/-/consul-api-double-3.1.6.tgz#46095438b6989a12cab382a88fdb7b227d834794" + integrity sha512-mRH7X7k1zSu/Aq+rs5VoJYrIhD3pO57d+j98dicfs+3KaMO1mQYFYKgyugY/g0kY9FQH3+vySeZ0W5nQs45V1Q== "@hashicorp/ember-cli-api-double@^3.1.0": version "3.1.0"