From cde294e831e1660264a0413950329b1f46c278b7 Mon Sep 17 00:00:00 2001 From: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Date: Wed, 1 Sep 2021 02:15:46 -0400 Subject: [PATCH] [APM] Custom links creation don't work (#110676) (#110748) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fixing custom links issue * Removing unused imports Co-authored-by: Cauê Marcondes <55978943+cauemarcondes@users.noreply.github.com> --- x-pack/plugins/apm/ftr_e2e/config.ts | 1 + .../power_user/settings/custom_links.spec.ts | 37 ++++++ .../apm/ftr_e2e/cypress/support/commands.ts | 4 +- .../apm/ftr_e2e/cypress/support/types.d.ts | 2 +- .../customize_ui/custom_link/EmptyPrompt.tsx | 1 + .../FlyoutFooter.tsx | 1 + .../create_edit_custom_link_flyout/index.tsx | 107 +++++++++--------- .../custom_link/custom_link_table.tsx | 1 + 8 files changed, 96 insertions(+), 58 deletions(-) create mode 100644 x-pack/plugins/apm/ftr_e2e/cypress/integration/power_user/settings/custom_links.spec.ts diff --git a/x-pack/plugins/apm/ftr_e2e/config.ts b/x-pack/plugins/apm/ftr_e2e/config.ts index 4cb218fd24755c..89cde8349c96e8 100644 --- a/x-pack/plugins/apm/ftr_e2e/config.ts +++ b/x-pack/plugins/apm/ftr_e2e/config.ts @@ -34,6 +34,7 @@ async function config({ readConfigFile }: FtrConfigProviderContext) { serverArgs: [ ...xpackFunctionalTestsConfig.get('kbnTestServer.serverArgs'), '--csp.strict=false', + '--csp.warnLegacyBrowsers=false', // define custom kibana server args here `--elasticsearch.ssl.certificateAuthorities=${CA_CERT_PATH}`, ], diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/integration/power_user/settings/custom_links.spec.ts b/x-pack/plugins/apm/ftr_e2e/cypress/integration/power_user/settings/custom_links.spec.ts new file mode 100644 index 00000000000000..eeb46db04b9d43 --- /dev/null +++ b/x-pack/plugins/apm/ftr_e2e/cypress/integration/power_user/settings/custom_links.spec.ts @@ -0,0 +1,37 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +const basePath = '/app/apm/settings/customize-ui'; + +describe('Custom links', () => { + beforeEach(() => { + cy.loginAsPowerUser(); + }); + + it('shows empty message and create button', () => { + cy.visit(basePath); + cy.contains('No links found'); + cy.contains('Create custom link'); + }); + + it('creates custom link', () => { + cy.visit(basePath); + const emptyPrompt = cy.get('[data-test-subj="customLinksEmptyPrompt"]'); + cy.contains('Create custom link').click(); + cy.contains('Create link'); + cy.contains('Save').should('be.disabled'); + cy.get('input[name="label"]').type('foo'); + cy.get('input[name="url"]').type('https://foo.com'); + cy.contains('Save').should('not.be.disabled'); + cy.contains('Save').click(); + emptyPrompt.should('not.exist'); + cy.contains('foo'); + cy.contains('https://foo.com'); + cy.get('[data-test-subj="editCustomLink"]').click(); + cy.contains('Delete').click(); + }); +}); diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/support/commands.ts b/x-pack/plugins/apm/ftr_e2e/cypress/support/commands.ts index 31eab9507ef5e6..93dbe4ba51226e 100644 --- a/x-pack/plugins/apm/ftr_e2e/cypress/support/commands.ts +++ b/x-pack/plugins/apm/ftr_e2e/cypress/support/commands.ts @@ -11,8 +11,8 @@ Cypress.Commands.add('loginAsReadOnlyUser', () => { cy.loginAs({ username: 'apm_read_user', password: 'changeme' }); }); -Cypress.Commands.add('loginAsSuperUser', () => { - cy.loginAs({ username: 'elastic', password: 'changeme' }); +Cypress.Commands.add('loginAsPowerUser', () => { + cy.loginAs({ username: 'apm_power_user', password: 'changeme' }); }); Cypress.Commands.add( diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/support/types.d.ts b/x-pack/plugins/apm/ftr_e2e/cypress/support/types.d.ts index b47e664e0a0f8a..2d9ef090eef651 100644 --- a/x-pack/plugins/apm/ftr_e2e/cypress/support/types.d.ts +++ b/x-pack/plugins/apm/ftr_e2e/cypress/support/types.d.ts @@ -8,7 +8,7 @@ declare namespace Cypress { interface Chainable { loginAsReadOnlyUser(): void; - loginAsSuperUser(): void; + loginAsPowerUser(): void; loginAs(params: { username: string; password: string }): void; changeTimeRange(value: string): void; expectAPIsToHaveBeenCalledWith(params: { diff --git a/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/EmptyPrompt.tsx b/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/EmptyPrompt.tsx index 9d6a3eef3f7eb7..498e17b9c359db 100644 --- a/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/EmptyPrompt.tsx +++ b/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/EmptyPrompt.tsx @@ -17,6 +17,7 @@ export function EmptyPrompt({ }) { return ( )} -
- - - -

- {i18n.translate( - 'xpack.apm.settings.customizeUI.customLink.flyout.title', + + + + +

+ {i18n.translate( + 'xpack.apm.settings.customizeUI.customLink.flyout.title', + { + defaultMessage: 'Create link', + } + )} +

+ + + + +

+ {i18n.translate( + 'xpack.apm.settings.customizeUI.customLink.flyout.label', + { + defaultMessage: + 'Links will be available in the context of transaction details throughout the APM app. You can create an unlimited number of links. You can refer to dynamic variables by using any of the transaction metadata to fill in your URLs. More information, including examples, are available in the', + } + )}{' '} + - - - - -

- {i18n.translate( - 'xpack.apm.settings.customizeUI.customLink.flyout.label', - { - defaultMessage: - 'Links will be available in the context of transaction details throughout the APM app. You can create an unlimited number of links. You can refer to dynamic variables by using any of the transaction metadata to fill in your URLs. More information, including examples, are available in the', - } - )}{' '} - -

- + /> +

+ - + - + - + - + - + - - + + - - - - + + + ); } diff --git a/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/custom_link_table.tsx b/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/custom_link_table.tsx index 4a242bb661e3a6..86a7a8742eaea0 100644 --- a/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/custom_link_table.tsx +++ b/x-pack/plugins/apm/public/components/app/Settings/customize_ui/custom_link/custom_link_table.tsx @@ -79,6 +79,7 @@ export function CustomLinkTable({ items = [], onCustomLinkSelected }: Props) { icon: 'pencil', color: 'primary', type: 'icon', + 'data-test-subj': 'editCustomLink', onClick: (customLink: CustomLink) => { onCustomLinkSelected(customLink); },