$yanutetsu->{blog}

プログラマ三大美徳なPM

Google Sign-in ボタンが Angular で時々表示されない

Angular TypeScript

やぬてつです。 この記事は Angular 8 をターゲットにしています。

問題

今まで問題なく動いていると思っていたのだけれど、時々ボタンが表示されない現象が起きた。

調査

stack overflow にこんな記事があった。 https://stackoverflow.com/questions/32625970/google-signin-button-in-angularjs-sometimes-does-not-show-up

これは AngularJS なので Angular に対応させる必要がありそう。

タイミングの問題かな？と思って ngOnInitに書いたり、 ngAfterViewInit に書いたりしたが、結果はあまり変わらなかった。 どこに書いたらいいのだろうか？タイミングの問題じゃない？

特殊な書き方をしているところは window[] を利用しているところなので、ここをいじってみる。

window['onSignIn'] = (user) => ngZone.run(() => this.authService.onSignIn(user).then(() => this.redirect()));

これをこうしてみた。

gapi.signin2.render('signin-button', {
  'scope': 'profile email https://www.googleapis.com/auth/admin.directory.group.readonly',
  'longtitle': true,
  'theme': 'dark',
  'onsuccess': googleUser => this.ngZone.run(() => this.authService.onSignIn(googleUser).then(() => this.redirect())),
});

一緒にボタンのカスタマイズもこのタイミングで行うように変更した。

まとめ

何が原因かはわからないが、これでなんとかなった。

Angular で Did you add it to @NgModule.entryComponent? って言われた

Angular

やぬてつです。

この記事はAngularでDialogを作成しようとしている自分自身に向けて書いています。

調べたら以下のリンクで解決しました。

stackoverflow.com

ルーティングに登録されていないコンポーネントは declarations に入れなくちゃいけないんだっけか？

この1年間どんな英語の勉強をしてきたか

やぬてつです。

この記事は英語学習 Advent Calendar 2018 - Adventarの21日目の記事です。

この１年間の英語の勉強の内容を書いていきます。

この1年間はラジオ英会話をメイン教材として学習していました。今までは瞬間英作文をメインとした学習をしていましたが、暗記してしまいがちであることと、もっと文法を武器にしたいと考えて、メインの学習をラジオ英会話にしました。

ラジオ英会話は以下の方法で利用しました。

  • テキストを見ない状態で3回以上リスニングする
  • テキストを15回以上音読する
  • テキストを見ないで15回以上リピーティングする
  • 空き時間があったらリピーティングする

これを4月からずっと続けてきました。

効果はとしてはだいぶ英語に慣れてきたって感じですね。英文の流れがかなり自然に感じるようになってきました。 技術ドキュメントも半分くらいは翻訳にかけないで読んでいるくらいでしょうか。ほんとだいぶ読めるようになってきたなーって感じです。

あとは息抜きに英語の番組を見るようにしていました。ゲームオブスローンズとかシリコンバレーとか、HBOばかりですね。英語字幕が出ると最高なんですが、日本語字幕で見てました。少しでも英語に触れている時間を長くしようとしてました。

やらなければならないことはまだたくさんあるけれど、できることから少しずつ続けることを第一の目標にやってきました。来年も１歩ずつ進めていこうと思います。

Angular の index.html の内容を環境毎に書き換えたい

Angular

やぬてつです。 この記事はAngular7以降を対象としています。

Angular を実装していると index.html に記述する内容を環境毎に変更したい場合ありますよね。 environmentを使う感じかなーって思ってそこにまとめるけど、いざ実装しようと思うと index.html に書き込めるのか？ってなりますよね。なんか単純に動かないような気がするし。

このissueに解決の策がありました。

Angular index.html を環境毎に書き換える https://github.com/angular/angular-cli/issues/4451#issuecomment-399888807

environment.ts と同様に index.html を書き換えてしまえば良いって感じ。

それぞれの環境に合わせて本番なら index.production.html 、開発環境なら index.dev.html という感じで環境毎に index.html をそのまま作っておき、ビルド時に書き換えてしまうという方法です。

結構悩んだんだけど、これでひとまずは解決できそう。

めでたしめでたし

GoLandでコードスニペットする

golang GoLand

やぬてつです。

この記事はGoLand初心者をターゲットとしています。

最近GoLandを利用し始めたんですが、今までのエディタにあった機能どこにあるんだろ？ってこと多々ありますよね？

その中でも特にコードスニペットがなかなか辛いところです。特にGo言語を書いていると定型的な記述が多いのでっていうところもあると思います。

例によってGoLandでコードスニペットを探していたんですが、最近ようやくコードスニペットの機能を見つけました。

みなさん ライブ・テンプレート って知ってますか？

どうやらこれがコードスニペットに当たる機能のようです。

Preferences > Editor > Live Templates

ここに例によってgolangで人類に優しいログを出力する - $yanutetsu->{blog}のスニペットを設置します。

見つけるまで結構苦労しましたが、設定はとても簡単です。

またこれで快適なGoLand生活へ一歩近づきましたー＼(^o^)／

GoLandでテストするときにテスト対象を絞る方法

golang GoLand

やぬてつです。

この記事のターゲットはGoLand初心者の方です。

Go言語は各種ツールが揃っているのでコンソールで作業している方も多いと思います。 私もほとんどコンソールで開発しているのですが、チームでGoLandを利用していることから、少しずつGoLandによる開発を始めました。

開発時にはテストを回して開発するので、自分の担当範囲に絞ってテストを回したいです。コンソールで開発していた時はこんな感じです。

$ go test ./service/... --run TestUsers

これをGoLandでやる場合にはどうやるかが問題です。

普通に公式ドキュメントに書いてありました。

Go tests - Help | GoLand

Pattern – use this field to filter what tests to run. It sets -run parameter of go test. If the field is empty then filters are not set and GoLand will run all tests.

訳すとこんな感じ？

フィルターしてテストを実行するためにこのフィールドを利用してください。 go test の -run パラメータとして設定します。 もし、空を設定した場合は、フィルターは設定されず、GoLandは全てのテストを実行します。

configurationの Pattern に対象としたい文字列を入れることで、テスト対象を絞ることができました。

Spanner+Goでnullの扱いによるツラミ

GCP Spanner golang

やぬてつです。

この記事は Cloud Spanner をGo言語でゴニョゴニョしている人をターゲットにしています。

慣れないSQLと格闘している時、値が設定されていないカラムを引っ張ろうとしたところ、

spanner: code = "InvalidArgument", desc = "cannot decode field Hoge of Cloud Spanner STRUCT ... , destination *bool cannot support NULL SQL values"

こんな感じでエラーを吐かれた。

エラー吐いているところのソースを辿っていくと、

errDstNotForNull returns error for decoding a SQL NULL value into a destination which doesn't support NULL values.

このように書かれているので、当てている型がダメみたい。

Google先生に聞いてみたら database/sql の sql.NullBool 使ったら解決したよって見つけたので早速使ってみました。

, type *sql.NullBool cannot be used for decoding BOOL"

これでも解決しない...

あれ？何がダメなんだろう？いろんな記事にはこれ使えって書いてあったのに...

と、思っていたらついに見つけました！どうやらdatabase/sql は MySQL のもので Spanner では cloud.google.com/go/spanner を使わなければならないらしい。

google-cloud-go/value.go at master · GoogleCloudPlatform/google-cloud-go · GitHub

ということで spanner.NullBool を使うことで解決しました。

もしかして、GoでRDBとかしている人には常識なのかな？