-
Notifications
You must be signed in to change notification settings - Fork 2.6k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Angular17 standalone sample app (#7017)
Adds Angular 17 sample that uses MSAL Angular v3 to msal-angular-v3-samples. Note: Documentation update for Angular 17 support is in PR #7018
- Loading branch information
Showing
38 changed files
with
6,716 additions
and
161 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
16 changes: 16 additions & 0 deletions
16
samples/msal-angular-v3-samples/angular17-standalone-sample/.editorconfig
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
# Editor configuration, see https://editorconfig.org | ||
root = true | ||
|
||
[*] | ||
charset = utf-8 | ||
indent_style = space | ||
indent_size = 2 | ||
insert_final_newline = true | ||
trim_trailing_whitespace = true | ||
|
||
[*.ts] | ||
quote_type = single | ||
|
||
[*.md] | ||
max_line_length = off | ||
trim_trailing_whitespace = false |
42 changes: 42 additions & 0 deletions
42
samples/msal-angular-v3-samples/angular17-standalone-sample/.gitignore
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
# See http://help.github.com/ignore-files/ for more about ignoring files. | ||
|
||
# Compiled output | ||
/dist | ||
/tmp | ||
/out-tsc | ||
/bazel-out | ||
|
||
# Node | ||
/node_modules | ||
npm-debug.log | ||
yarn-error.log | ||
|
||
# IDEs and editors | ||
.idea/ | ||
.project | ||
.classpath | ||
.c9/ | ||
*.launch | ||
.settings/ | ||
*.sublime-workspace | ||
|
||
# Visual Studio Code | ||
.vscode/* | ||
!.vscode/settings.json | ||
!.vscode/tasks.json | ||
!.vscode/launch.json | ||
!.vscode/extensions.json | ||
.history/* | ||
|
||
# Miscellaneous | ||
/.angular/cache | ||
.sass-cache/ | ||
/connect.lock | ||
/coverage | ||
/libpeerconnection.log | ||
testem.log | ||
/typings | ||
|
||
# System files | ||
.DS_Store | ||
Thumbs.db |
4 changes: 4 additions & 0 deletions
4
samples/msal-angular-v3-samples/angular17-standalone-sample/.vscode/extensions.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846 | ||
"recommendations": ["angular.ng-template"] | ||
} |
20 changes: 20 additions & 0 deletions
20
samples/msal-angular-v3-samples/angular17-standalone-sample/.vscode/launch.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
{ | ||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 | ||
"version": "0.2.0", | ||
"configurations": [ | ||
{ | ||
"name": "ng serve", | ||
"type": "chrome", | ||
"request": "launch", | ||
"preLaunchTask": "npm: start", | ||
"url": "http://localhost:4200/" | ||
}, | ||
{ | ||
"name": "ng test", | ||
"type": "chrome", | ||
"request": "launch", | ||
"preLaunchTask": "npm: test", | ||
"url": "http://localhost:9876/debug.html" | ||
} | ||
] | ||
} |
42 changes: 42 additions & 0 deletions
42
samples/msal-angular-v3-samples/angular17-standalone-sample/.vscode/tasks.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
{ | ||
// For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558 | ||
"version": "2.0.0", | ||
"tasks": [ | ||
{ | ||
"type": "npm", | ||
"script": "start", | ||
"isBackground": true, | ||
"problemMatcher": { | ||
"owner": "typescript", | ||
"pattern": "$tsc", | ||
"background": { | ||
"activeOnStart": true, | ||
"beginsPattern": { | ||
"regexp": "(.*?)" | ||
}, | ||
"endsPattern": { | ||
"regexp": "bundle generation complete" | ||
} | ||
} | ||
} | ||
}, | ||
{ | ||
"type": "npm", | ||
"script": "test", | ||
"isBackground": true, | ||
"problemMatcher": { | ||
"owner": "typescript", | ||
"pattern": "$tsc", | ||
"background": { | ||
"activeOnStart": true, | ||
"beginsPattern": { | ||
"regexp": "(.*?)" | ||
}, | ||
"endsPattern": { | ||
"regexp": "bundle generation complete" | ||
} | ||
} | ||
} | ||
} | ||
] | ||
} |
28 changes: 28 additions & 0 deletions
28
samples/msal-angular-v3-samples/angular17-standalone-sample/README.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
# Angular 17 Standalone MSAL Angular v3 Sample | ||
|
||
This developer sample is used to demonstrate how to use `@azure/msal-angular` with Angular standalone components, and **does not** use the `MsalModule` or `NgModule`. Please see [Angular's docs on standalone](https://angular.io/guide/standalone-components) for more information. | ||
|
||
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.3.3, and uses Angular 17's application builder, but **does not** demonstrate use of server-side and prerendering capabilities. See [Angular's docs](https://angular.io/guide/esbuild) for more details. | ||
|
||
## How to run the sample | ||
|
||
### Pre-requisites | ||
- Ensure [all pre-requisites](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/README.md) have been completed to run msal-angular. | ||
|
||
### Configure the application | ||
- Open `./src/main.ts` in an editor. | ||
- Replace client id with the Application (client) ID from the portal registration, or use the currently configured lab registration. | ||
- Optionally, you may replace any of the other parameters, or you can remove them and use the default values. | ||
|
||
### Running the sample | ||
- In a command prompt, run `npm run start`. | ||
- Navigate to [http://localhost:4200](http://localhost:4200) | ||
- In the web page, click on the "Login" button. The app will automatically reload if you change any of the source files. | ||
|
||
## Local development | ||
|
||
If you are trying to run this sample locally in the MSAL.js repo, run `npm run build` before `npm run start` to install a tarball file of MSAL Angular. | ||
|
||
## Additional notes | ||
- This sample does not use the `MsalRedirectComponent`, but subscribes to `handleRedirectObservable` in the `app.component.ts` file. See our doc on [redirects](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/redirects.md) for more information. | ||
- The default interaction type for the sample is redirects. The sample can be configured to use redirects by changing the `interactionType` in `main.ts` to `InteractionType.Popup`. |
126 changes: 126 additions & 0 deletions
126
samples/msal-angular-v3-samples/angular17-standalone-sample/angular.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,126 @@ | ||
{ | ||
"$schema": "./node_modules/@angular/cli/lib/config/schema.json", | ||
"version": 1, | ||
"newProjectRoot": "projects", | ||
"projects": { | ||
"angular17-standalone-sample": { | ||
"projectType": "application", | ||
"schematics": {}, | ||
"root": "", | ||
"sourceRoot": "src", | ||
"prefix": "app", | ||
"architect": { | ||
"build": { | ||
"builder": "@angular-devkit/build-angular:application", | ||
"options": { | ||
"outputPath": "dist/angular17-standalone-sample", | ||
"index": "src/index.html", | ||
"browser": "src/main.ts", | ||
"polyfills": [ | ||
"zone.js" | ||
], | ||
"tsConfig": "tsconfig.app.json", | ||
"assets": [ | ||
"src/favicon.ico", | ||
"src/assets" | ||
], | ||
"styles": [ | ||
"@angular/material/prebuilt-themes/deeppurple-amber.css", | ||
"src/styles.css" | ||
], | ||
"scripts": [] | ||
}, | ||
"configurations": { | ||
"production": { | ||
"optimization": { | ||
"styles": { | ||
"inlineCritical": false // Causes setAttribute errors | ||
} | ||
}, | ||
"budgets": [ | ||
{ | ||
"type": "initial", | ||
"maximumWarning": "500kb", | ||
"maximumError": "1mb" | ||
}, | ||
{ | ||
"type": "anyComponentStyle", | ||
"maximumWarning": "2kb", | ||
"maximumError": "4kb" | ||
} | ||
], | ||
"fileReplacements": [ | ||
{ | ||
"replace": "src/environments/environment.ts", | ||
"with": "src/environments/environment.prod.ts" | ||
} | ||
], | ||
"outputHashing": "all" | ||
}, | ||
"e2e": { | ||
"fileReplacements": [ | ||
{ | ||
"replace": "src/environments/environment.ts", | ||
"with": "src/environments/environment.e2e.ts" | ||
} | ||
] | ||
}, | ||
"dev": { | ||
"optimization": false, | ||
"extractLicenses": false, | ||
"sourceMap": true, | ||
"namedChunks": true, | ||
"fileReplacements": [ | ||
{ | ||
"replace": "src/environments/environment.ts", | ||
"with": "src/environments/environment.dev.ts" | ||
} | ||
] | ||
} | ||
}, | ||
"defaultConfiguration": "production" | ||
}, | ||
"serve": { | ||
"builder": "@angular-devkit/build-angular:dev-server", | ||
"configurations": { | ||
"production": { | ||
"buildTarget": "angular17-standalone-sample:build:production" | ||
}, | ||
"e2e": { | ||
"buildTarget": "angular17-standalone-sample:build:e2e" | ||
}, | ||
"dev": { | ||
"buildTarget": "angular17-standalone-sample:build:dev" | ||
} | ||
}, | ||
"defaultConfiguration": "dev" | ||
}, | ||
"extract-i18n": { | ||
"builder": "@angular-devkit/build-angular:extract-i18n", | ||
"options": { | ||
"buildTarget": "angular17-standalone-sample:build" | ||
} | ||
}, | ||
"test": { | ||
"builder": "@angular-devkit/build-angular:karma", | ||
"options": { | ||
"polyfills": [ | ||
"zone.js", | ||
"zone.js/testing" | ||
], | ||
"tsConfig": "tsconfig.spec.json", | ||
"assets": [ | ||
"src/favicon.ico", | ||
"src/assets" | ||
], | ||
"styles": [ | ||
"@angular/material/prebuilt-themes/deeppurple-amber.css", | ||
"src/styles.css" | ||
], | ||
"scripts": [] | ||
} | ||
} | ||
} | ||
} | ||
} | ||
} |
9 changes: 9 additions & 0 deletions
9
samples/msal-angular-v3-samples/angular17-standalone-sample/jest.config.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
module.exports = { | ||
displayName: "angular17-standalone-sample", | ||
globals: { | ||
__PORT__: 4217, | ||
__STARTCMD__: "npm start -- --port 4217", | ||
__TIMEOUT__: 90000 | ||
}, | ||
preset: "../../e2eTestUtils/jest-puppeteer-utils/jest-preset.js" | ||
}; |
48 changes: 48 additions & 0 deletions
48
samples/msal-angular-v3-samples/angular17-standalone-sample/package.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
{ | ||
"name": "angular17-standalone-sample", | ||
"version": "0.0.0", | ||
"scripts": { | ||
"ng": "ng", | ||
"start": "ng serve", | ||
"build": "npm run postinstall:msal-angular && ng build", | ||
"postinstall:msal-angular": "node ../sample-scripts/useMsalAngularTarball.js", | ||
"watch": "ng build --watch --configuration development", | ||
"test": "ng test", | ||
"lint": "ng lint", | ||
"e2e": "jest" | ||
}, | ||
"private": true, | ||
"dependencies": { | ||
"@angular/animations": "^17.3.0", | ||
"@angular/common": "^17.3.0", | ||
"@angular/compiler": "^17.3.0", | ||
"@angular/core": "^17.3.0", | ||
"@angular/forms": "^17.3.0", | ||
"@angular/material": "^17.3.3", | ||
"@angular/platform-browser": "^17.3.0", | ||
"@angular/platform-browser-dynamic": "^17.3.0", | ||
"@angular/router": "^17.3.0", | ||
"@azure/msal-angular": "^3.0.13", | ||
"@azure/msal-browser": "^3.10.0", | ||
"rxjs": "~7.8.0", | ||
"tslib": "^2.3.0", | ||
"zone.js": "~0.14.3" | ||
}, | ||
"devDependencies": { | ||
"@angular-devkit/build-angular": "^17.3.3", | ||
"@angular/cli": "^17.3.3", | ||
"@angular/compiler-cli": "^17.3.0", | ||
"@types/jasmine": "~5.1.0", | ||
"@types/jest": "^29.5.12", | ||
"e2e-test-utils": "^0.0.1", | ||
"jasmine-core": "~5.1.0", | ||
"jest": "^29.7.0", | ||
"karma": "~6.4.0", | ||
"karma-chrome-launcher": "~3.2.0", | ||
"karma-coverage": "~2.2.0", | ||
"karma-jasmine": "~5.1.0", | ||
"karma-jasmine-html-reporter": "~2.1.0", | ||
"ts-jest": "^29.1.2", | ||
"typescript": "~5.4.2" | ||
} | ||
} |
7 changes: 7 additions & 0 deletions
7
samples/msal-angular-v3-samples/angular17-standalone-sample/src/app/app.component.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
.toolbar-spacer { | ||
flex: 1 1 auto; | ||
} | ||
|
||
a.title { | ||
color: white; | ||
} |
Oops, something went wrong.