diff --git a/addons/rose/metadata.json b/addons/rose/metadata.json new file mode 100644 index 000000000..7ce820fad --- /dev/null +++ b/addons/rose/metadata.json @@ -0,0 +1,5 @@ +{ + "versions": { + "main": "https://boundary-ui-storybook.vercel.app" + } +} \ No newline at end of file diff --git a/addons/rose/package.json b/addons/rose/package.json index 6015a8a51..7e167be63 100644 --- a/addons/rose/package.json +++ b/addons/rose/package.json @@ -9,7 +9,7 @@ ], "scripts": { "build:development": "ember build", - "build": "ember build --environment=production", + "build": "ember build --environment=production && cp metadata.json dist/metadata.json", "lint": "npm-run-all --aggregate-output --continue-on-error --parallel 'lint:!(fix)'", "lint:fix": "npm-run-all --aggregate-output --continue-on-error --parallel lint:*:fix", "lint:hbs": "ember-template-lint .", diff --git a/ui/desktop/tests/end2end/authentication.spec.js b/ui/desktop/tests/end2end/authentication.spec.js index 71667b0de..93540c0f7 100644 --- a/ui/desktop/tests/end2end/authentication.spec.js +++ b/ui/desktop/tests/end2end/authentication.spec.js @@ -1,14 +1,14 @@ /* eslint-disable no-undef */ const { test, expect } = require('@playwright/test'); const { _electron: electron } = require('playwright'); -const { - generateScreenshotPath, - returnExecutablePath, -} = require('./test-helpers'); +const helpers = require('./test-helpers'); let electronApp = null; const screenshotsDirectory = 'authentication/'; -const executablePath = returnExecutablePath(process.platform, process.arch); +const executablePath = helpers.returnExecutablePath( + process.platform, + process.arch +); test.beforeEach(async () => { electronApp = await electron.launch({ @@ -29,6 +29,7 @@ test.describe('Authentication end to end test suite', async () => { test.describe('user/password authentication test suite', async () => { test('Authenticates using user and password method and deauthenticates ', async () => { const boundaryWindow = await electronApp.firstWindow(); // The window that contains the app. + // Override local storage origin await boundaryWindow.evaluate(() => window.localStorage.setItem('desktop:origin', null) @@ -42,31 +43,32 @@ test.describe('Authentication end to end test suite', async () => { await boundaryWindow.fill('[name=host]', originValue); // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath(screenshotsDirectory, 'fillOrigin'), + path: helpers.generateScreenshotPath( + screenshotsDirectory, + 'fillOrigin' + ), fullPage: true, }); // Click the submit button - // Due to an error with await boundaryWindow.click('button[type="submit"]'); we are using a workaround. - // More info about it here: https://github.com/microsoft/playwright/issues/1808 await boundaryWindow.waitForSelector('button[type="submit"]'); - await boundaryWindow.$eval('button[type="submit"]', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'button[type="submit"]'); + // Fill user & password await boundaryWindow.fill('[name="identification"]', authLoginNameValue); await boundaryWindow.fill('[name="password"]', authLoginPasswordValue); // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath(screenshotsDirectory, 'fillUserPassword'), + path: helpers.generateScreenshotPath( + screenshotsDirectory, + 'fillUserPassword' + ), fullPage: true, }); // Click submit await boundaryWindow.waitForSelector('button[type="submit"]'); - await boundaryWindow.$eval('button[type="submit"]', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'button[type="submit"]'); // Check we are in Targets await boundaryWindow.waitForURL('**/#/scopes/global/projects/targets'); @@ -75,39 +77,45 @@ test.describe('Authentication end to end test suite', async () => { // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath(screenshotsDirectory, 'afterLogin'), + path: helpers.generateScreenshotPath( + screenshotsDirectory, + 'afterLogin' + ), fullPage: true, }); // Opens user dropdown await boundaryWindow.waitForSelector('.rose-header-utilities'); - await boundaryWindow.$eval('.rose-header-utilities summary', (element) => - element.click() - ); + await helpers.click(boundaryWindow, '.rose-header-utilities summary'); // User dropdown is visible await boundaryWindow.waitForSelector('details[open]'); expect(await boundaryWindow.isVisible('details')); // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath(screenshotsDirectory, 'userDropdown'), + path: helpers.generateScreenshotPath( + screenshotsDirectory, + 'userDropdown' + ), fullPage: true, }); // Clicks Deauthenticate await boundaryWindow.waitForSelector('text="Deauthenticate"'); - await boundaryWindow.$eval('text="Deauthenticate"', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'text="Deauthenticate"'); // Makes sure we are log out await boundaryWindow.waitForSelector('main >> div.branded-card'); expect(await boundaryWindow.isVisible('h2 >> text=Authenticate')); - // ToDo: create an assertion checking localstorage ember_simple_auth-session key + // TODO: create an assertion checking localstorage ember_simple_auth-session key + // TODO: try to check we are log out by url // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath(screenshotsDirectory, 'afterLogout'), + path: helpers.generateScreenshotPath( + screenshotsDirectory, + 'afterLogout' + ), fullPage: true, }); }); @@ -126,26 +134,24 @@ test.describe('Authentication end to end test suite', async () => { await boundaryWindow.fill('[name=host]', originValue); // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath(screenshotsDirectory, 'fillOrigin'), + path: helpers.generateScreenshotPath( + screenshotsDirectory, + 'fillOrigin' + ), fullPage: true, }); // Click the submit button - // Due to an error with await boundaryWindow.click('button[type="submit"]'); we are using a workaround. - // More info about it here: https://github.com/microsoft/playwright/issues/1808 await boundaryWindow.waitForSelector('button[type="submit"]'); - await boundaryWindow.$eval('button[type="submit"]', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'button[type="submit"]'); + // Fill user & password await boundaryWindow.fill('[name="identification"]', authLoginNameValue); await boundaryWindow.fill('[name="password"]', authLoginPasswordValue); // Click submit await boundaryWindow.waitForSelector('button[type="submit"]'); - await boundaryWindow.$eval('button[type="submit"]', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'button[type="submit"]'); // Wait for the notification await boundaryWindow.waitForSelector('.rose-notification-body'); @@ -156,7 +162,7 @@ test.describe('Authentication end to end test suite', async () => { // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath( + path: helpers.generateScreenshotPath( screenshotsDirectory, 'notificationFailed' ), @@ -192,15 +198,11 @@ test.describe('Authentication end to end test suite', async () => { // Due to an error with await boundaryWindow.click('button[type="submit"]'); we are using a workaround. // More info about it here: https://github.com/microsoft/playwright/issues/1808 await boundaryWindow.waitForSelector('button[type="submit"]'); - await boundaryWindow.$eval('button[type="submit"]', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'button[type="submit"]'); // Click tab OIDC await boundaryWindow.waitForSelector('main >> div.branded-card >> nav'); - await boundaryWindow.$eval('a:text("OIDC")', (element) => { - element.click(); - }); + await helpers.click(boundaryWindow, 'a:text("OIDC")'); await boundaryWindow.pause(); }); diff --git a/ui/desktop/tests/end2end/targets.spec.js b/ui/desktop/tests/end2end/targets.spec.js index 2ee467d17..e71211cf1 100644 --- a/ui/desktop/tests/end2end/targets.spec.js +++ b/ui/desktop/tests/end2end/targets.spec.js @@ -1,14 +1,14 @@ /* eslint-disable no-undef */ const { test, expect } = require('@playwright/test'); const { _electron: electron } = require('playwright'); -const { - generateScreenshotPath, - returnExecutablePath, -} = require('./test-helpers'); +const helpers = require('./test-helpers'); let electronApp = null; const screenshotsDirectory = 'targets/'; -const executablePath = returnExecutablePath(process.platform, process.arch); +const executablePath = helpers.returnExecutablePath( + process.platform, + process.arch +); test.beforeEach(async () => { electronApp = await electron.launch({ @@ -42,21 +42,16 @@ test.describe('Targets end to end test suite', async () => { await boundaryWindow.fill('[name=host]', originValue); // Click the submit button - // Due to an error with await boundaryWindow.click('button[type="submit"]'); we are using a workaround. - // More info about it here: https://github.com/microsoft/playwright/issues/1808 await boundaryWindow.waitForSelector('button[type="submit"]'); - await boundaryWindow.$eval('button[type="submit"]', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'button[type="submit"]'); + // Fill user & password await boundaryWindow.fill('[name="identification"]', authLoginNameValue); await boundaryWindow.fill('[name="password"]', authLoginPasswordValue); // Click submit await boundaryWindow.waitForSelector('button[type="submit"]'); - await boundaryWindow.$eval('button[type="submit"]', (element) => - element.click() - ); + await helpers.click(boundaryWindow, 'button[type="submit"]'); // Check we are in Targets await boundaryWindow.waitForURL('**/#/scopes/global/projects/targets'); @@ -65,16 +60,16 @@ test.describe('Targets end to end test suite', async () => { // Click connect to a target await boundaryWindow.waitForSelector('table.rose-table'); - await boundaryWindow.$eval( - 'table.rose-table >> tbody >> tr >> nth=0 >> button >> text=Connect', - (element) => element.click() + await helpers.click( + boundaryWindow, + 'table.rose-table >> tbody >> tr >> nth=0 >> button >> text=Connect' ); // The target popup opens await boundaryWindow.waitForSelector('section.dialog-detail'); // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath( + path: helpers.generateScreenshotPath( screenshotsDirectory, 'targetConnectionDetails' ), @@ -82,9 +77,9 @@ test.describe('Targets end to end test suite', async () => { }); // Click copyable in popup // TODO: read clipboard value. Running into issues reading clipboard, so will take a shortcut for now - await boundaryWindow.$eval( - 'section.dialog-detail >> div.rose-dialog-body >> button', - (element) => element.click() + await helpers.click( + boundaryWindow, + 'section.dialog-detail >> div.rose-dialog-body >> button' ); // Temporary: persist proxy from target const persistedProxy = await boundaryWindow.innerText( @@ -92,21 +87,21 @@ test.describe('Targets end to end test suite', async () => { ); // Click close popup - await boundaryWindow.$eval( - 'section.dialog-detail >> footer >> button', - (element) => element.click() + await helpers.click( + boundaryWindow, + 'section.dialog-detail >> footer >> button' ); // On left nav menu, click Sessions await boundaryWindow.waitForSelector('section.rose-layout-global >> aside'); - await boundaryWindow.$eval( - 'section.rose-layout-global >> aside >> nav >> a >> text=Sessions', - (element) => element.click() + await helpers.click( + boundaryWindow, + 'section.rose-layout-global >> aside >> nav >> a >> text=Sessions' ); // Take screenshot await boundaryWindow.screenshot({ - path: generateScreenshotPath(screenshotsDirectory, 'sessions'), + path: helpers.generateScreenshotPath(screenshotsDirectory, 'sessions'), fullPage: true, }); diff --git a/ui/desktop/tests/end2end/test-helpers.js b/ui/desktop/tests/end2end/test-helpers.js index ff6902143..ba7e739fd 100644 --- a/ui/desktop/tests/end2end/test-helpers.js +++ b/ui/desktop/tests/end2end/test-helpers.js @@ -42,3 +42,13 @@ exports.returnExecutablePath = (platform, arch) => { console.error(error); } }; + +/** + * Performs a click with a workarouind due to an error with plain playwright click. + * More info about the issue here: https://github.com/microsoft/playwright/issues/1808 + * @param {*} appWindow The current electron window. + * @param {*} selector The DOM element selector. + */ +exports.click = async (appWindow, selector) => { + await appWindow.$eval(selector, (element) => element.click()); +};