本文へスキップ
Future Tech Blog
フューチャー技術ブログ
メニュー
表示テーマ
表示テーマ: 端末の設定に従う。切り替える
表示テーマ: 明るい。切り替える
表示テーマ: 暗い。切り替える
カテゴリ
カテゴリ
開発
Programming
327
Frontend
135
Mobile
57
IoT
52
VR
20
基盤
DevOps
136
Cloud
79
DB
70
Infrastructure
70
IaC
57
AI
DataScience
100
AIDD
51
DataEngineering
46
セキュリティ
Security
36
認証認可
24
ビジネス
Culture
131
Business
50
Management
48
連載
連載
人気の連載
秋のブログ週間2025
Go1.26リリース
Go1.27リリース
春の入門祭り2025
春の入門祭り2024
AI Tips
連載一覧へ
リソース
リソース
フューチャーのガイドライン
設計ガイドライン・コーディング規約
仕事ですぐに使えるTypeScript
(外部サイト)
実務向けの実践テキスト
OSS / ツール
(外部サイト)
Cheetah Grid / uroboroSQL / Vuls
アクティビティ
アクティビティ
HACK TO THE FUTURE
フューチャー主催のプログラミングコンテスト
Future Tech Cast
技術ブログ発のポッドキャスト
アドベントカレンダー
2015年からの歴代一覧
表示テーマ: 端末の設定に従う。切り替える
表示テーマ: 明るい。切り替える
表示テーマ: 暗い。切り替える
検索を開く
最近の検索
すべて消す
人気のタグ
Go言語
266
ガイドライン
23
設計
44
AWS
138
Python
60
Docker
40
生成AI
27
PostgreSQL
29
Claude
18
Java
41
タグ一覧へ
ホーム
タグ
Playwright
タグ
よく読まれている記事
data-testidはいつ使うべきか?そもそも使うべきなのか?
2023.11
♡
66
Playwrightのインストール方法と使い方
2023.08
♡
7
イチ押し。Playwrightの快適機能
2023.08
♡
17
PlaywrightをGitHubActions実行したときの初期処理についての試行錯誤
2023.08
♡
34
Playwrightの環境構築(VSCode Dev Containers編)
2023.08
♡
7
Playwright連載始まります
2023.08
♡
69
よく使われるカテゴリ
Frontend
11本
新着記事
全13本
Playwrightでなぜかボタンにヒットしない
getByRoleでボタンがヒットしないです、という相談を受けて調べた内容のメモです。次のようなHTMLになっていました。
2024.10.24
澁川喜規
Frontend
Xでポストする:Playwrightでなぜかボタンにヒットしない
Facebookでシェアする:Playwrightでなぜかボタンにヒットしない
はてなブックマークで見る:Playwrightでなぜかボタンにヒットしない(1ブックマーク)
1
Pocketに保存する:Playwrightでなぜかボタンにヒットしない(2保存)
2
[入門]Webフロントエンド E2E テスト を出版しました
[入門]Webフロントエンド E2E テスト ――PlaywrightによるWebアプリの自動テストから良いテストの書き方まで をフューチャーの有志と共に出版いたしました。
2024.07.01
武田大輝
Frontend
Xでポストする:[入門]Webフロントエンド E2E テスト を出版しました
Facebookでシェアする:[入門]Webフロントエンド E2E テスト を出版しました
はてなブックマークで見る:[入門]Webフロントエンド E2E テスト を出版しました(14ブックマーク)
14
Pocketに保存する:[入門]Webフロントエンド E2E テスト を出版しました(8保存)
8
data-testidはいつ使うべきか?そもそも使うべきなのか?
Playwrightあるいはそのロケーターの元ネタとなっているTesting Libraryでは、DOMを指定する方法として data-testid 属性を扱ったクエリーを提供しています。
2023.11.28
澁川喜規
Frontend
Xでポストする:data-testidはいつ使うべきか?そもそも使うべきなのか?
Facebookでシェアする:data-testidはいつ使うべきか?そもそも使うべきなのか?
はてなブックマークで見る:data-testidはいつ使うべきか?そもそも使うべきなのか?(46ブックマーク)
46
Pocketに保存する:data-testidはいつ使うべきか?そもそも使うべきなのか?(20保存)
20
アクセシビリティに考慮した出力値のHTMLマークアップ
以前書いたCypressの記事で、アクセシビリティ情報を使うことで壊れにくくなるよ、と(今では当たり前のようにみんな言っていますが)いう記事を書きました。この時は出力に使うべきロールが何か?というのがわかっていませんでした。> サーバーからとってきた動的な値を表示するテキスト
2023.10.03
澁川喜規
Frontend
Xでポストする:アクセシビリティに考慮した出力値のHTMLマークアップ
Facebookでシェアする:アクセシビリティに考慮した出力値のHTMLマークアップ
はてなブックマークで見る:アクセシビリティに考慮した出力値のHTMLマークアップ(2ブックマーク)
2
Pocketに保存する:アクセシビリティに考慮した出力値のHTMLマークアップ(1保存)
1
ChatGPTでE2Eテストコード自動作成
9/7に行われた技育CAMPアカデミアというイベントでPlaywrightについて話をしてきました。テストというと、設計手法であるところのテスト駆動開発は別としてちょっと業務っぽい感じがして学生さんにはちょっと響かないかな、というのも心配でしたが
2023.09.25
澁川喜規
AIDD
Xでポストする:ChatGPTでE2Eテストコード自動作成
Facebookでシェアする:ChatGPTでE2Eテストコード自動作成
はてなブックマークで見る:ChatGPTでE2Eテストコード自動作成(4ブックマーク)
4
Pocketに保存する:ChatGPTでE2Eテストコード自動作成(5保存)
5
クライアント/サーバ構成でみるPlaywright
Playwrightはさまざまな言語でテストを記述できます。このような他言語展開を可能にしているPlaywrightのアーキテクチャについて調べてみました。
2023.08.29
武田大輝
Frontend
Xでポストする:クライアント/サーバ構成でみるPlaywright
Facebookでシェアする:クライアント/サーバ構成でみるPlaywright
はてなブックマークで見る:クライアント/サーバ構成でみるPlaywright(2ブックマーク)
2
Pocketに保存する:クライアント/サーバ構成でみるPlaywright(11保存)
11
PlaywrightをGitHubActions実行したときの初期処理についての試行錯誤
近年PlaywrightやCypressを用いたE2Eテスト(エンドツーエンドテスト)が行われるようになってきました。E2Eテストとはソフトウェアやシステムの全体的な動作や機能をテストする手法で...
2023.08.28
枇榔晃裕
DevOps
Xでポストする:PlaywrightをGitHubActions実行したときの初期処理についての試行錯誤
Facebookでシェアする:PlaywrightをGitHubActions実行したときの初期処理についての試行錯誤
はてなブックマークで見る:PlaywrightをGitHubActions実行したときの初期処理についての試行錯誤(22ブックマーク)
22
Pocketに保存する:PlaywrightをGitHubActions実行したときの初期処理についての試行錯誤(12保存)
12
Playwrightのテストランナーを他のテストライブラリと比較する
テスティングフレームワークには大きく2つの流派があります。ひとつはJUnit、あるいはその祖先の SUnitをベースにしたTDDスタイルものです。TDDスタイルはテスト関数、もしくはメソッドを実行します。
2023.08.25
澁川喜規
Frontend
Xでポストする:Playwrightのテストランナーを他のテストライブラリと比較する
Facebookでシェアする:Playwrightのテストランナーを他のテストライブラリと比較する
はてなブックマークで見る:Playwrightのテストランナーを他のテストライブラリと比較する
Pocketに保存する:Playwrightのテストランナーを他のテストライブラリと比較する(6保存)
6
イチ押し。Playwrightの快適機能
Playwright連載3日目の今回は、その便利機能たちをCypressと比較しながら紹介します。Cypressで馴染みの便利機能がPlaywrightではどう実現されているのか、E2Eテストに関わる関係者の悩みを解決するどんな便利機能が備わっているのか、詳しく見てみましょう。
2023.08.24
木戸俊輔
Frontend
Xでポストする:イチ押し。Playwrightの快適機能
Facebookでシェアする:イチ押し。Playwrightの快適機能
はてなブックマークで見る:イチ押し。Playwrightの快適機能(4ブックマーク)
4
Pocketに保存する:イチ押し。Playwrightの快適機能(13保存)
13
Playwrightの環境構築(VSCode Dev Containers編)
VSCode Dev Containersを利用してPlaywrightの実行環境をコンテナ上に構築する手順を説明します。
2023.08.23
武田大輝
Frontend
Xでポストする:Playwrightの環境構築(VSCode Dev Containers編)
Facebookでシェアする:Playwrightの環境構築(VSCode Dev Containers編)
はてなブックマークで見る:Playwrightの環境構築(VSCode Dev Containers編)(1ブックマーク)
1
Pocketに保存する:Playwrightの環境構築(VSCode Dev Containers編)(6保存)
6
Playwrightのインストール方法と使い方
Playwrightは、Microsoftが開発したE2Eテストフレームワークです。Cypressと同様に、Chromium、Firefox、Safariなどのブラウザ上でE2Eテストの実行を自動化できます。
2023.08.22
藤戸四恩
Frontend
Xでポストする:Playwrightのインストール方法と使い方
Facebookでシェアする:Playwrightのインストール方法と使い方
はてなブックマークで見る:Playwrightのインストール方法と使い方(3ブックマーク)
3
Pocketに保存する:Playwrightのインストール方法と使い方(4保存)
4
Playwright連載始まります
現在人気が高まりつつあって、Cypressを追い抜こうとしているのがPlaywrightです。かなりCypressを意識して機能追加を行なってきている印象があります。現時点では...
2023.08.21
澁川喜規
Frontend
Xでポストする:Playwright連載始まります
Facebookでシェアする:Playwright連載始まります
はてなブックマークで見る:Playwright連載始まります(39ブックマーク)
39
Pocketに保存する:Playwright連載始まります(30保存)
30
SvelteKitのデフォルトプロジェクトから学ぶ
ウェブアプリケーションフレームワークとして最近注目度が少しずつ上がっているのがSvelteです。以前、Svelteをちょびっとサンプルを触ってみた感じ、コードの雰囲気はscript setup版のVue 3っぽいなー、という感じです。あとはプロパティ入力のあるコンポーネントでHTMLを生成するという基本構成はReactもAngularもみんなそうなので、今時のウェブフロントエンドのフレームワークを触ったことがあれば難しくはない気がします。
2022.04.15
澁川喜規
Frontend
Xでポストする:SvelteKitのデフォルトプロジェクトから学ぶ(7ポスト)
7
Facebookでシェアする:SvelteKitのデフォルトプロジェクトから学ぶ
はてなブックマークで見る:SvelteKitのデフォルトプロジェクトから学ぶ(5ブックマーク)
5
Pocketに保存する:SvelteKitのデフォルトプロジェクトから学ぶ(4保存)
4
1