From 571a193451c67821b8d40e870f89c02e32c14295 Mon Sep 17 00:00:00 2001 From: Saulius Skliutas <24278440+saskliutas@users.noreply.github.com> Date: Mon, 18 Mar 2024 13:51:48 +0200 Subject: [PATCH] Switch to new demo user API (#156) * Revive demo user * Update port --- .env.example | 6 ++-- CONTRIBUTING.md | 46 ++++++++++++++------------ app/e2e-tests/src/setup.ts | 2 +- app/e2e-tests/src/utils.ts | 2 +- app/frontend/src/app/Authorization.tsx | 2 +- app/frontend/webpack.config.ts | 1 + 6 files changed, 31 insertions(+), 28 deletions(-) diff --git a/.env.example b/.env.example index b8c4e19..6d2bf14 100644 --- a/.env.example +++ b/.env.example @@ -12,10 +12,10 @@ # - Application type: # - SPA (Single web page app) # - Redirect URIs: -# - http://localhost:8080/auth/callback -# - http://localhost:8080/auth/silent +# - http://localhost:3000/auth/callback +# - http://localhost:3000/auth/silent # - Post logout redirect URIs: -# - http://localhost:8080/ +# - http://localhost:3000/ # # Finally, copy and paste the generated client ID from the registered application's details page: OAUTH_CLIENT_ID=spa-xxxxxxxxxxxxxxxxxxxxxxxxx diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 4310926..c380491 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -8,8 +8,8 @@ Follow the [steps for running the application](./README.md#using). These actuall ### Directory structure -* `app/` — contains source code for the editor application. -* `presentation-rules-editor-react/` — contains reusable components that can be added to other applications that wish to integrate a presentation ruleset editor. +- `app/` — contains source code for the editor application. +- `presentation-rules-editor-react/` — contains reusable components that can be added to other applications that wish to integrate a presentation ruleset editor. ### Localization @@ -23,8 +23,8 @@ To summarise, we only do string localization inside `ITwinJsApp/` subdirectory. We have two sets of tests: -* Unit tests for `presentation-rules-editor` package, which require 100% test coverage. -* End-to-end tests for the editor application. +- Unit tests for `presentation-rules-editor` package, which require 100% test coverage. +- End-to-end tests for the editor application. To run these tests, execute `npm test` in `presentation-rules-editor-react/` and `app/e2e-tests/` directories respectively. @@ -33,11 +33,11 @@ To run these tests, execute `npm test` in `presentation-rules-editor-react/` and ### Frontend 1. Launch Presentation Rules Editor application like you normally would. -2. In Visual Studio Code, execute `Debug: Open Link` command and enter `http://localhost:8080`. +2. In Visual Studio Code, execute `Debug: Open Link` command and enter `http://localhost:3000`. ### Backend -1. In Visual Studio Code, open a `JavaScript Debug Terminal`. +1. In Visual Studio Code, open a `JavaScript Debug Terminal`. 2. Start the backend from the created terminal. ### Core iTwin.js libraries @@ -46,19 +46,20 @@ To run these tests, execute `npm test` in `presentation-rules-editor-react/` and 2. `rush install` and `rush build` iTwin.js packages. 3. Run this top-level `npm` command in `presentation-rules-editor` repository: - ```shell - npm run link [path_to_the_cloned_itwinjs_repository] - ``` + ```shell + npm run link [path_to_the_cloned_itwinjs_repository] + ``` + + You can omit the path if both repositories share the same parent folder. - You can omit the path if both repositories share the same parent folder. 4. Start debugging the Presentation Rules Editor as you would normally. 5. Make sure to run `unlink` to restore changes made to both repositories by the `link` command: - ```shell - npm run unlink [path_to_the_cloned_itwinjs_repository] - ``` + ```shell + npm run unlink [path_to_the_cloned_itwinjs_repository] + ``` - Otherwise, you may experience weird behavior and errors when trying to run iTwin.js tests and test applications. + Otherwise, you may experience weird behavior and errors when trying to run iTwin.js tests and test applications. When using Visual Studio Code, you will need to add iTwin.js repository to the workspace in order to be able to set breakpoints in library code. This can be achieved by executing `Workspaces: Add Folder to Workspace...` command. @@ -70,17 +71,18 @@ The procedure used for generating optimized font subsets is laid out below. It a 1. Make sure the following Python packages are installed: - ```bash - pip install brotli fonttools - ``` + ```bash + pip install brotli fonttools + ``` 2. Download [`Open Sans` font](https://fonts.google.com/specimen/Open+Sans) archive and extract the compressed files. 3. Generate optimized font subsets by issuing the following commands: - ```bash - pyftsubset OpenSans-VariableFont_wdth,wght.ttf --unicodes="00-7F,A9" --flavor="woff2" --output-file=OpenSans-subset.woff2 - pyftsubset OpenSans-VariableFont_wdth,wght.ttf --unicodes="80-FFFF" --flavor="woff2" --output-file=OpenSans-rest.woff2 - ``` + ```bash + pyftsubset OpenSans-VariableFont_wdth,wght.ttf --unicodes="00-7F,A9" --flavor="woff2" --output-file=OpenSans-subset.woff2 + pyftsubset OpenSans-VariableFont_wdth,wght.ttf --unicodes="80-FFFF" --flavor="woff2" --output-file=OpenSans-rest.woff2 + ``` + + The character ranges in `unicodes` parameter for the first command must include all latin characters, digits, punctuation, and a © (copyright) symbol. The second font subset is generated out of all remaining characters, and may overlap slightly with the first one. Counterintuitively, although the first 32 unicode characters are not printable, expanding the range to include them results in a smaller font file. - The character ranges in `unicodes` parameter for the first command must include all latin characters, digits, punctuation, and a © (copyright) symbol. The second font subset is generated out of all remaining characters, and may overlap slightly with the first one. Counterintuitively, although the first 32 unicode characters are not printable, expanding the range to include them results in a smaller font file. 4. Make sure that the character ranges which were used to generate font subsets are matched in stylesheet rules. diff --git a/app/e2e-tests/src/setup.ts b/app/e2e-tests/src/setup.ts index 6a1e629..32d86b9 100644 --- a/app/e2e-tests/src/setup.ts +++ b/app/e2e-tests/src/setup.ts @@ -25,7 +25,7 @@ before(async function () { await settleAllPromises([ setupIModel(), setupBrowser({ debug }), - setupServers({ backendPort: 3001, frontendPort: 8080, debug }), + setupServers({ backendPort: 3001, frontendPort: 3000, debug }), ]); }); diff --git a/app/e2e-tests/src/utils.ts b/app/e2e-tests/src/utils.ts index ce4a146..4b3c202 100644 --- a/app/e2e-tests/src/utils.ts +++ b/app/e2e-tests/src/utils.ts @@ -5,7 +5,7 @@ import { Locator, Page } from "playwright"; export function getServiceUrl(): string { - return process.env.SERVICE_URL ?? "http://localhost:8080"; + return process.env.SERVICE_URL ?? "http://localhost:3000"; } export async function loadHomepage(page: Page): Promise { diff --git a/app/frontend/src/app/Authorization.tsx b/app/frontend/src/app/Authorization.tsx index e2f00e5..ab710f6 100644 --- a/app/frontend/src/app/Authorization.tsx +++ b/app/frontend/src/app/Authorization.tsx @@ -190,7 +190,7 @@ class DemoAuthClient implements AuthorizationClient { public async getAccessToken(): Promise { this.accessToken ??= (async () => { const response = await fetch( - "https://prod-imodeldeveloperservices-eus.azurewebsites.net/api/v0/sampleShowcaseUser/devUser", + "https://connect-itwinjscodesandbox.bentley.com/api/usertoken", ); const result = await response.json(); setTimeout( diff --git a/app/frontend/webpack.config.ts b/app/frontend/webpack.config.ts index 719f5a9..bd05131 100644 --- a/app/frontend/webpack.config.ts +++ b/app/frontend/webpack.config.ts @@ -171,6 +171,7 @@ export default function (webpackEnv: any): Configuration & { devServer?: any } { // Always serve /index.html instead of 404 status code historyApiFallback: true, hot: true, + port: 3000, client: { overlay: { runtimeErrors: (error: Error) => {