【Angular】ルーティング後に別サイトにリダイレクトする
概要
- Angular でルーティン後に自動で別サイトにリダイレクトするサンプルを作成する。
用途
- ルーティング後にFormの内容をPOSTして別サイトにリダイレクトしたいケース
- POSTしたいデータについてをAngular内で取得して設定したいケース
実装方針
- テンプレート側に
<form>を用意する。 <form>にはリダイレクト先のURLをactionに設定する。ViewChildでHTMLFormElementの参照を取得する。ngAfterViewInit内でHTMLFormElementを submitしてルーティング後にリダイレクト処理を発生させる。
【Github Actions】SonarCloud と連携させる（2019/09/15現在）
概要
- Github Actions（2019/09/15現在のβ版）と SonarCloud を連携させたサンプルを作成する。
- TSLint + Jest実行後に Github Actions上でSonarCloud Scan を実行して、SonarCloud側に保存する。
参考URL
参考過去記事
続きを読む【Jest】jasmine.clock().mockDate()を拡張して使用する
概要
- Jest で
jasmine.clock().mockDate()を使用するための拡張のサンプルです。 MockDateを使用して実現しています。Date.now()・new Date()・moment()などの値がMockDateにより上書きされます。- ちなみに Jestでは Jasmine記法でのテストコード実装が可能です。
jasmine.createSpyなども使用できます。jasmine.clock().mockDate()も型参照はできますが 実行時にundefinedになります。
前回の記事
続きを読む【Jest】mockdateを使用したサンプル
概要
- Jest 24.9 では
jasmine.clock().mockDateのように Dateをテスト用に上書き機能がありません。 mockdateライブラリを利用してjasmine.clock().mockDate()を代用できます。
【Angular】特定ファイルのカバレッジを除外
概要
Angularのユニットテストで特定ファイルをカバレッジから除外したいケースがあります。
以下の設定をすることで対応可能です。
angular.jsonの test の設定にcodeCoverageExcludeを追加する。- Globs形式でカバレッジ除外対象のファイルを指定する。
動作環境
- Angular - 8.x
サンプル
- index.ts, polyfills.ts, test.ts をカバレッジから除外するサンプル
{ "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "version": 1, "newProjectRoot": "projects", "projects": { "ng-sample": { "root": "", "sourceRoot": "src", "projectType": "application", "prefix": "app", "schematics": {}, "architect": { "test": { "builder": "@angular-devkit/build-angular:karma", "options": { "main": "src/test.ts", "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.spec.json", "karmaConfig": "src/karma.conf.js", "styles": [ "src/styles.css" ], "scripts": [], "assets": [ "src/favicon.ico", "src/assets" ], "codeCoverageExclude": [ "src/**/index.ts", "src/polyfills.ts", "src/test.ts" ] } } } } }, "defaultProject": "ng-sample" }
参考URL
【Git】現在ブランチのコミットIDをファイル出力
概要
Gitで現在ブランチのコミットIDをファイルに出力する。
利用シーン
- ビルド時のコミットIDを保存したいケース
実行環境
- Bash
- Git
サンプルソース
git log -n 1 --pretty=format:"%H" > dist/commit-id.txt # c8f8ab484161c025f5b1e62135f3d067aa841791
Gitコマンド解説
log: 変更履歴を確認-n 1: 変更履歴の表示数を指定。今回は直前のコミット１件のみ確認したいので1を指定。-pretty=format:"%H":-pretty=format:で変更履歴の出力フォーマットの指定が可能。%Hは コミットID。> dist/commit-id.txt: bashのリダイレクト。指定したファイルにコマンド出力の結果を保存する。
サンプルソース一式
参考URL
備忘録
- Angularビルド時にコミットIDを保存して、コミットIDをチェックするサンプルを作る
【イベント参加】ng-japan2019に参加してきました
概要
ng-japan 2019に参加してきました。
バージョン8.0や次のリリースに含まれる内容などの話しだったり、開発事例の話しがメインでした。
全体的な感想
- Cordova関連の話しが色々なセッションで出たけど、ハイブリッドアプリって流行ってるのかな？
- Angular Material が Angular Components のリポジトリになったみたいですね。
- Ivy + Bazel はプレビュー機能が出ているので、もうすぐですね。
- MonorepoとSEOの話しは知識がなかったので参考になりました。
ControlValueAccessorの話しは玄人向けだった。FormControlを自作したい方向けでしたね。 kakkoyakakko2.hatenablog.com
NgRxなどのデータストアも含めた全体のパターンなどの話しがあるとうれしかった。
- Angular ElementsのScopedZoneの話しがマニアックすぎた。
メモ書き
以下に参加しながら記載したメモ書きを貼っておきます。
時間があれば修正するかも。
その他
- 今回はランチ＋おやつ付でした。 今年のおやつはどら焼き！
