Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
アーキテクチャを把握し、テスト観点の漏れをなくす
Search
SHIFT EVOLVE
PRO
June 12, 2024
Technology
0
130
アーキテクチャを把握し、テスト観点の漏れをなくす
JaSST'24 Tohoku(
https://www.jasst.jp/symposium/jasst24tohoku.html
)
DAAEテクノロジーグループ
栗山晃
SHIFT EVOLVE
PRO
June 12, 2024
Tweet
Share
More Decks by SHIFT EVOLVE
See All by SHIFT EVOLVE
努力家なスクラムマスターが陥る「傍観者」という罠と乗り越えた先に信頼があった話 / 20250830 Takahiro Sasaki
shift_evolve
PRO
2
120
キャリアを支え組織力を高める「多層型ふりかえり」 / 20250821 Kazuki Mori
shift_evolve
PRO
2
330
製造業からパッケージ製品まで幅広く適用!5分でわかる「生成AIを利用したテストシナリオ生成」 / 20250725 Suguru Ishii
shift_evolve
PRO
0
260
教えます!AWSにおけるセキュリティ対策の可視化の方法 やってみた!!AWSにおけるセキュリティ対策の可視化の実践 / 20250423 Hironobu Otaki
shift_evolve
PRO
2
220
SHIFTのDNAとAIの融合:普及から活用へのパラダイムシフト / 20250423 Eiichi Hayashi
shift_evolve
PRO
0
16
サイバー攻撃のシミュレーション:攻撃者の視点からみる防御のむずかしさ!AWSで試してみよう / 20250423 Kumiko Hemmi
shift_evolve
PRO
1
330
Viteの魅力とビルドプロセスに迫る / 20250423 Takuto Nishikiori
shift_evolve
PRO
1
190
開発生産性Conference afterイベント「川口 耕介氏/Kent Beck氏のご紹介」 / 20250707 Hiromitsu Akiba & Ryutaro Yoshiba
shift_evolve
PRO
1
170
fukabori.fm 出張版: 売上高617億円と高稼働率を陰で支えた社内ツール開発のあれこれ話 / 20250704 Yoshimasa Iwase & Tomoo Morikawa
shift_evolve
PRO
4
12k
Other Decks in Technology
See All in Technology
Grafana Meetup Japan Vol. 6
kaedemalu
1
190
ヘブンバーンズレッドにおける、世界観を活かしたミニゲーム企画の作り方
gree_tech
PRO
0
400
退屈なことはDevinにやらせよう〜〜Devin APIを使ったVisual Regression Testの自動追加〜
kawamataryo
4
960
実践AIガバナンス
asei
3
260
ZOZOマッチのアーキテクチャと技術構成
zozotech
PRO
2
770
現場が抱える様々な問題は “組織設計上” の問題によって生じていることがある / Team-oriented Organization Design 20250827
mtx2s
7
69k
衝突して強くなる! BLUE GIANTと アジャイルチームの共通点とは ― いきいきと活気に満ちたグルーヴあるチームを作るコツ ― / BLUE GIANT and Agile Teams
naitosatoshi
0
280
DeNA での思い出 / Memories at DeNA
orgachem
PRO
6
1.9k
Figma + Storybook + PlaywrightのMCPを使ったフロントエンド開発
yug1224
10
3.5k
クラウドセキュリティを支える技術と運用の最前線 / Cutting-edge Technologies and Operations Supporting Cloud Security
yuj1osm
2
240
JavaScript 研修
recruitengineers
PRO
6
1.3k
「魔法少女まどか☆マギカ Magia Exedra」のグローバル展開を支える、開発チームと翻訳チームの「意識しない協創」を実現するローカライズシステム
gree_tech
PRO
0
410
Featured
See All Featured
Measuring & Analyzing Core Web Vitals
bluesmoon
9
570
What's in a price? How to price your products and services
michaelherold
246
12k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.9k
Into the Great Unknown - MozCon
thekraken
40
2k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
110
20k
For a Future-Friendly Web
brad_frost
179
9.9k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
The Language of Interfaces
destraynor
160
25k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Transcript
株式会社SHIFT DAAEテクノロジーグループ 栗山晃 アーキテクチャを把握し、テスト観点の 漏れをなくす
1 アジェンダ アジェンダ 1. 自己紹介 2. 概要 3. GA(Google Analytics)のアーキテクチャ1
4. GA(Google Analytics)のアーキテクチャ2 5. 「GAタグを貼りつけるだけ」のテスト観点 6. 終わりに
2 自己紹介(発表者の紹介) 1.自己紹介 ・名前:栗山 晃 ・役割:DAAEテクノロジーグループ リードエンジニア&プロジェクトマネージャ ・普段の業務 ⇒ Webシステムの開発
⇒ テストケースのレビュー ⇒ その他もろもろ 開発エンジニアの観点で、「テスト観点の漏れをなくす」ための考え方をご紹介します。
・「GAタグ(Google Analyticsタグ)」とは? Google Analyticsが提供するコードをWebサイトに埋め込む(単純に張りつけるだけ)で、 Webサイトに訪れるユーザー数やその動向を把握できるようになるツールです。 3 概要:アーキテクチャを把握し、テスト観点の漏れをなくす 2.概要 「GAタグ(Google Analyticsタグ)を埋め込むだけ」を例に「アーキテクチャからテスト観点の
漏れをなくすための考え方」を説明します 「アーキテクチャを把握し、テスト観点の漏れをなくす」 「コードを単純に張りつけるだけ」なので、間違いようがない。テストの必要性があるのだ ろうか? いったい何をテストしたらいいのだろうか?
4 GAのアーキテクチャ1:GAの通信の仕組み 3. GAのアーキテクチャ1 GAタグは「ユーザーの情報」を 取得し、「外部のサーバー (Google)」に送信する 悪質なプログラム(マルウェア)と 同じような動き 防止する仕組みがある(CSP:
Contents Security Policy) ブラウザ Webサーバー GAタグを含むソースコード (HTML, Javascript) Webサイトにおけるユーザーの動 向などのデータ GAタグ ソースコード(HTML+Javascript) GA(Google)
5 GAのアーキテクチャ2:GAの通信の仕組み + CSP(Contents Security Policy) 4.GAのアーキテクチャ2 GAタグが正常に動作するには、適切 にCSPが設定されている必要がある。 ブラウザ
Webサーバー GAタグを含むソースコード (HTML, Javascript) + CSPヘッダー(CSP設定の 指示) Webサイトにおけるユーザーの動 向などのデータ GAタグ ソースコード(HTML+Javascript) GA(Google) CSP設定に従い、 GAタグの通信を 制御 必要なテスト観点 ・CSP設定が適切に設定されていること。 ・GAタグが正常に動作していること ※確認方法例 ChromeのDeveloperツールのコンソール でエラーが出ないことを確認する
6 「GAタグを貼りつけるだけ」のテスト観点 5. 「GAタグを貼りつけるだけ」のテスト観点 GAタグが正常に動作するた めには、CSPに関わる観点を もつことが必要。 そういった観点は、「アーキ テクチャを把握」しないと、 もつことが難しい。
GAタグを貼り つけるだけ 間違いようがな いからテスト不 要 HTMLのソース を見てGAタグが あることを確認 アーキテクチャ を把握 必要なテスト観 点を把握(CSP設 定の観点をもつ)
7 終わりに 6.終わりに 「アーキテクチャを把握し、テスト観点の漏れをなくす」は以上です。 こういった考え方を皆様の担当するシステムにも応用していけると思います。 本発表が、皆様のテスト観点の漏れの防止につながり、より良いプロダクトの開発に繋がれ ば幸いです。 【ご紹介】 SHIFT DAAEテクノロジーグループに興味のある方はこちら
https://speakerdeck.com/shiftgroup/32bace1293215fd26da32d547531881d