自己紹介 https://x.com/mizchi Node.js とフロントエンドの専門家 経歴 ゲームクライアント開発 Electron アプリ開発 サードパーティスクリプト フリーランス(2回目) 現在: 1ヶ月でパフォチュする傭兵 Core Web Vitals CI/CD 今日のスコープ 話すこと 主にフロントエンド/アプリケーション視点での計測 とくにエンドユーザーから見たウェブパフォーマンス体験 話さないこと 各クラウドやDBに特化したチューニング 結果として観測できるが、最初からターゲットにはしない パフォーマンス傭兵を始めた経緯 前職でサードパーティがサイト全体に与える影響(CWV)について調査 とにかくいろんなサイトを外部から計測 真の問題を特定しても「弊社とは無関係」で打ち返す以外なく、歯痒い コスパよく直せる部分をみんな放置している！！！ 非機能要件の優先度が上がら
はじめに 開発業務で「情報収集」や「タスク自動化」をするときにスクレイピングやクローリングを用いる場合があると思います。一時期私もスクレイピング関連の本を読んでBeautifulSoup, Seleniumなどを使って自動化をしましたが、CSSセレクタを指定していくのが大変だったり、DOM構造が変わると動かなくなったりと、色々苦労した覚えがあります。 そんな時、browser-useという面白そうなライブラリを見つけたので、この記事では、browser-useを使ってみた内容を自分用のメモとして残そうと思います。 browser-useとは？ browser-useはAIを使ってブラウザ操作を自動化してくれるツールです。 このツールは、Pythonを使ってブラウザで実行する操作をテキストで渡してあげると、AIがそのテキストに基づき操作を行ってくれます。そのためスクレイピング/提携業務の自動
Developers Summit 2025（2025.02.13-14） - 翔泳社イベント 1日目 13-E-9 あなたのプロダクトが見たい！個人開発リレーセッション で話したときの資料です。 https://event.shoeisha.jp/devsumi/20250213/session/5551
フロントエンドテストの正解って？FAANSにおけるテスト戦略の振り返りとこれから - ZOZO TECH BLOG
はじめに こんにちは、FAANS部フロントエンドブロックでWeb開発をしている平舘です。 Webフロントエンドのテスト戦略って、結局どうすればいいのか、よくわからなくないですか？ この記事では、FAANS Webアプリケーション開発におけるテスト実装の歴史を「リリース期」「急成長期」「現在」という3つの開発フェーズに分けて振り返ります。プロダクト立ち上げからのリアルな現場感とともに振り返りつつ、主にテスト配分についてチームで議論しながらプロダクトへ反映していった歴史のレポートになっています。みなさんのテスト戦略の見直しや実践のヒントになれば幸いです。 目次 はじめに 目次 背景・課題 この記事で語らないこと 前提：FAANSについて 開発の歴史とテスト戦略の変遷 フェーズ1. 怒涛のリリース期 起きたこと (1) 関心の中心は、「何をつくるか」 (2) こなれない実装 (3) jest-d
こんにちは、QAの木下です。 この記事では、E2E自動テスト環境の改善に成功した話について、紹介します。 E2E自動テストツール導入時からの変化 現行のE2E自動テストツールの課題 ウェルスナビで実施しているリグレッションテストは、企業が提供するE2E自動テストツールを利用する前提で、テストケースやテストシナリオを作成していました。 そのためテストケースやテストシナリオが、ベンダーロックイン状態となっていて、企業でサービスに対して大きな変更が行われた場合、ウェルスナビでのテスト実施に大きな影響がありました。 もしE2E自動テストツールの利用ができなくなった場合、手動でリグレッションテストを実施する必要があります。 しかし、現在のウェルスナビでのリグレッションテストは、E2E自動テストツールを導入する前と比較して、対象のWebサイトが提携企業の増加とともに大きく増えているため、テスト対象の範
Railsを扱う時に考えること
概要 こういうことを実践できたらメンテナンスしやすいRailsアプリケーションを構築できるんだろうな、というポエムです。 前提 以下の条件を前提に書いています。 0→1の構築である 自由に技術を決められる モノリス モジュラモノリスは考えない 複数DBは考えない スコープ ざっと以下のことを考えたいと思います。 フロントをRailsで構築するかどうか REST vs GraphQL RDBMS選定 ライブラリ選定 静的解析 rubocop モデリング つまりDB設計 アーキテクチャ Yes MVC, No Layerd Architecture サービスクラスの是非 Fat Controllerの避け方 自動テスト戦略 RSpec (Playwright) コンテナ化 令和時代のRailsに最適化されたDockerfileの書き方 インフラリソース クラウドプロバイダー選定(AWS, GC
LINEヤフーのフロントエンド技術を明らかにするState of LY Frontend 2024実施レポート
LINEヤフーでは、2024年の10月に社内のWebフロントエンド開発に携わる社内のメンバーを対象に、昨今のWebフロントエンド関連のトレンドや周辺ツールの利用状況について調査するアンケート「State of LY Frontend 2024」を実施しました。これは、以前は「UIT Global Survey」とも呼ばれていた取り組みの後継でもあり、毎年社内に向けて実施されているものです（昨年度の実施レポート）。同様の取り組みとして State of JavaScript や State of CSS が知られていますが、そのLINEヤフー版と想像していただけるとわかりやすいかと思います。 今回のサーベイは、合併会社誕生後1年がたち、新会社の体制が整って以来初めて広く周知されたものとなりました。そのため、Webフロントエンド開発者だけで 342人 という、単独のグループ社員としてはあまり例
[Browser Use] 触ってみた結果と感想
# 必要なライブラリをインポート from langchain_openai import ChatOpenAI # OpenAIのチャットモデルを利用するためのライブラリ from browser_use import Agent # エージェント機能を提供するライブラリ import asyncio # 非同期処理を使うためのライブラリ # 非同期関数mainを定義 async def main(): # Agentのインスタンスを作成 agent = Agent( task="Zennで小倉さんというユーザーの最新記事を教えて", # エージェントに対するタスク（質問） llm=ChatOpenAI(model="gpt-4o", api_key="xxxxxxxxxxxxxx"), # GPT-4oモデルを使う（APIキーは仮の値） ) # エージェントにタスクを実行させ、その結果
![[Browser Use] 触ってみた結果と感想](https://cdn-ak-scissors.b.st-hatena.com/image/square/2d460bdf240183e5fab90b48c628ebae17ad0140/height=288;version=1;width=512/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--41ff8_pi--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3A%25255BBrowser%252520Use%25255D%252520%2525E8%2525A7%2525A6%2525E3%252581%2525A3%2525E3%252581%2525A6%2525E3%252581%2525BF%2525E3%252581%25259F%2525E7%2525B5%252590%2525E6%25259E%25259C%2525E3%252581%2525A8%2525E6%252584%25259F%2525E6%252583%2525B3%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_37%3A%2525E5%2525B0%25258F%2525E5%252580%252589%2525E3%252581%252582%2525E3%252582%252593%252520%252Cx_203%252Cy_121%2Fg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyL2FhZTc3ZDA0MzcuanBlZw%3D%3D%252Cr_max%252Cw_90%252Cx_87%252Cy_95%2Fv1627283836%2Fdefault%2Fog-base-w1200-v2.png)
こんにちは、九州大学大学院1年の@masaと申します。 私は、2024年11月から12月末までの2ヶ月間、メルカリ ハロのフロントエンドエンジニアとして、インターンに参加しました。 左からインターンの@masa、メンターの@d–chanさん 今回は、その中で特に注力したインテグレーションテスト戦略と、メルカリでの学びについてお話しします。 なぜ「メルカリ ハロ」のインターンに参加したのか インターンに参加した主な目的は、大規模サービス、特にtoC向けのサービス開発を体験することでした。メルカリのサービスの中でもメルカリ ハロは、リリースして1年も経っていない新規のプロダクトであり、スピードと品質が求められる現場で、実践的な開発プロセスを学ぶ絶好の機会だと考えました。 また、メルカリという会社の雰囲気やカルチャーを直接体験して解像度を上げてみたいという興味も、参加の大きな動機の一つでした。
はじめに Visual Regression Test (以下VRT) やっていますか？ ありがちなケースとして VRT が安定せずにオオカミ少年化し、誰も差分のレポートを気にしなくなってしまって、CI のリソースやコストを食い潰すだけの仕組みになってしまうということがあると思います😇 この記事では VRT を安定化させるためのアプローチと、Storybook をベースにテストが実行できる Storybook Test runner 機能の活用法について紹介します！ VRTを安定化させるアプローチ base64エンコードした画像の利用 Storybook で表示する画像の例として以下があります。 ローカルのファイル クラウドストレージ上のファイル Placeholder.com などのダミー画像生成サービス VRT 用のスクリーンショット撮影時にこれらの画像のロードが完了していないことが
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
In March 2024, a new AI company burst onto the scene with impressive backing: a $21 million Series A led by Founders Fund, with support from industry leaders including the Collison brothers, Elad Gil, and other tech luminaries. The team behind it? IOI gold medalists - the kind of people that solve programming problems most of us can’t even understand. Their product, Devin, promised to be a fully a
Stagehand
The AI Web Browsing FrameworkStagehand extends the power of Playwright, allowing you to reliably automate browsers in natural language.
Annotations | Playwright
Introduction Playwright supports tags and annotations that are displayed in the test report. You can add your own tags and annotations at any moment, but Playwright comes with a few built-in ones: test.skip() marks the test as irrelevant. Playwright does not run such a test. Use this annotation when the test is not applicable in some configuration. test.fail() marks the test as failing. Playwrigh
In 2024, the Deno team made significant strides towards our vision of simplifying programming. We launched the highly anticipated Deno 2, which provides backwards compatibility with Node and npm, adds dependency management to the toolchain, and expanded flexibility with monorepo and workspace support. Here’s a summary of notable technical improvements in 2024: You can now run Node applications wit
2025/02/13(木)、14(金)で開催されたデブサミ2025に関する、現時点で公開資料と X アカウントリンクをまとめました。 よろしければご活用ください。 はじめに 講演名は一部わからない方がいらしたため、追った内容ベースで括弧書きの仮名で書いています。 登壇者名は敬称略させていただいています。 X アカウントについては、多くの方はデブサミ公式サイトの紹介ページに記載 or 資料記載がありましたので、そちらから引用させていただきました。 そちらに記載がなかった方については、別途分かった方のみ記載。 スライドについては、ご本人がツイートで展開されていたり、スライドサービスにアップロードされているものを記載。 リンクの間違い等ありましたらコメントいただけると助かります🙏 2025/02/13(木) 13-A-1 技術と情熱で創る未来 登壇者：及川 卓也[Tably] @takorat
JSer.info #724 - Bun 1.2がリリースされました。 Bun 1.2 | Bun Blog Bun 1.2ではNode.jsとの互換性の向上としてnode:http2/node:dgram/node:clusterのサポートが追加されています。 また、Bun.s3のS3 APIの追加、Bun.sqlのPostgresのサポート、テキストベースのbun.lockファイルのサポートされています。 そのほかには、package.jsonにコメントを書けるように、.npmrcファイルのサポート。bun run --filter、bun publishコマンドのサポート、bun patchのサポートなどが追加されています。 Tailwind CSS v4.0がリリースされました。 Tailwind CSS v4.0 - Tailwind CSS Lightning CSSを使った新
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? JavaScriptライブラリのトレンドを紹介しているBest of JSが、2024年に最もホットであったJavaScriptライブラリのランキングを発表しました。 選考基準は『GitHubにおいて2024年の一年間で増えたスターの数』です。 累計スター数は評価に入れないため、過去流行っていたけど最近は落ち目となった技術は出てきません。 この1年で注目されている技術がわかるランキングとなっています。 ちなみに総合ランキング1位は2016年～2019年にVue.jsが4連覇、2020年はDeno、2021年はzx、2022年はBun、2
ep.168『総勢342人の大規模フロントエンドサーベイ！State of LY 2024から見えるLINEヤフーの現場の変遷』 | UIT INSIDE
@potato4d が @spring_raining とともに、大規模社内フロントエンドサーベイについて語りました。 State of LY フロントエンド2024とは https://techblog.lycorp.co.jp/ja/20250210a もともと「UIT Global Survey」として実施されていたフロントエンドエンジニア向けのアンケート State of JSやState of CSSを参考にした社内版 合併によるテックスタックの変化を把握する目的 アンケート実施の背景と目的 2023年10月に実施されたアンケート LINEとYahooの合併により、元々のテックスタックを明らかにする 最新の技術動向を社内で共有 アンケート結果の概要 回答数342件、LINEとYahooの合併後のデータ JSライブラリではReactが最多、次いでVue.js CSSではTailwi
Playwrightのスクリーンショットのテストをする際、差分として考慮したくない部分に関してmaskを指定できる。 test('snapshot', async ({ page }) => { await page.goto('https://playwright.dev/') await expect(page).toHaveScreenshot({ mask: [ page.locator(".navbar__title.text--truncate"), page.locator(".getStarted_Sjon"), ] }) }) ある程度のランダムに発生する部分はこれで対処可能なのだが、トーストなどこれだけだと考慮しきれないケースがあり、消す方法を考えた パターン1: removeで行う 要素を指定してremove()で消すことを考えた test('snapshot', a
CloudWatch Synthetics で 2要素認証（2FA/MFA）が必要な Web アプリのブラウザテストを自動化してみた | DevelopersIO
CloudWatch Synthetics で 2要素認証（2FA/MFA）が必要な Web アプリのブラウザテストを自動化してみた こんにちは。テクニカルサポートチームのShiinaです。 はじめに 2要素認証（2FA/MFA）が設定されたアプリケーションのテスト自動化は、ワンタイムパスワードトークンの手動入力が必要なため困難です。 今回、AWS Amplify UI Authenticator を利用した Web アプリケーションに対し、CloudWatch Synthetics を用いて2要素認証を含むテストを自動化してみました。 本記事では、Secrets Manager を利用した安全な認証情報の管理と、Playwright を活用した認証プロセス操作を自動化する方法をご紹介します。 前提 Canary ランタイムには Playwright を使用します。 Amplify UI
今日もいつものようにシラスでデイリーAIニュースを配信していると、とんでもないものにでくわした。 もうタイトルに書いてあるけど、AIが勝手にブラウザを操作して色々やってくれてしまう、その名もBrowserUseだ。 インストールは超簡単。 macなら以下の二行だけだ。 $ pip install browser-use $ playwright install使うのも超簡単だが、コマンドラインに落ちるのが怖い人々には簡単に見えないかもしれない。環境変数のOPENAI_API_KEYとかにAPIキーを入れておくこと。 $ python >>> from langchain_openai import ChatOpenAI >>> from browser_use import Agent INFO [browser_use] BrowserUse logging setup complete
Playwrightでのウェブスクレイピングガイド。このチュートリアルでは、強力なスクレイピングツールのPlaywrightを使用してデータをスクレイピングする方法を、手順を追って解説します。 ウェブには、調査やビジネス上の意思決定に非常に役立つ膨大な量のデータがあります。そのため、Playwrightのようなツールの使い方を知っておくことがとても重要になります。 Playwrightはマイクロソフト社が開発した強力なNode.jsライブラリで、ウェブサイトからデータをスクレイピングできます。この記事では、Playwrightを使用してBright Dataのホームページからデータをスクレイピングする、実用的で詳細な例をご紹介します。これらの例をご覧いただいた後で、Playwrightでスクレイピングしたい他のウェブサイトに適用できます。 Playwrightを使う理由 ウェブスクレイピン
非エンジニアでもわかる！Playwrightで始める業務自動化の第一歩 - 1. 環境構築 - | DevelopersIO
Playwrightはブラウザ操作を自動化できる強力なツールです。本記事では、非エンジニアでも理解できるように、Playwrightの基本や簡単な自動化スクリプトの作成手順、業務効率化への応用例を解説します。 1. はじめに 毎日繰り返される「目視確認」や「定型的なデータ入力」作業に疲れていませんか？ そんな時に役立つのが、Playwright です。 Playwright は、ブラウザ操作を自動化するための強力なツール。 特にバックオフィス業務においては、日常的な業務負担を軽減し、より重要な業務に時間を使えるようになります。 この記事の目的 Playwrightが何かを知る Playwrightで何ができるのか理解する 簡単なスクリプトを実行し、自動化を体験する 2. 非エンジニアにもわかるキーワード解説 E2Eテストとは？ E2E（End-to-End）テスト とは、「システム全体を最
はじめに こんにちは。株式会社ミラボの開発部に所属している川原です。 今回はNext.js(SSR)とPrismaで構築したWebシステムのE2Eテストをご紹介します。 背景 毎回リリース時に既存機能が正常に動作しているか不安で、主要機能についてはブラウザで同じような動作確認を繰り返していました。 これでは時間と労力もかかり確認漏れも発生する恐れもあるため、実際の利用者操作を自動化し確認できるようにしたいと考え、E2Eテスト作成し自動化することにしました。 最終目標 Pull Request作成時に、E2Eテストが自動実行されること 毎回同じ環境でテストできるように、実行前にテスト用のデータベースを起動・初期化すること 利用者操作→管理者操作の順で実際の運用フローに沿った試験が行えること 最小限のシナリオにとどめ、実行時間は必ず5分以内で終わる操作パターンに絞り記述すること この記事を読ん
React の ViewTransition コンポーネントなど: Cybozu Frontend Weekly (2025-01-21号)
React の ViewTransition コンポーネントなど: Cybozu Frontend Weekly (2025-01-21号) こんにちは！ サイボウズ株式会社 フロントエンドエンジニア（内定者バイト）の mehm8128 (@mehm8128) です。 はじめに サイボウズ社内では毎週火曜日に Frontend Weekly と題し「一週間の間にあったフロントエンドニュースを共有する会」を開催しています。 今回は、2025/01/21 の Frontend Weekly で取り上げた記事や話題を紹介します。 取り上げた記事・話題 Oracle has informed us they won’t voluntarily withdraw their trademark on "JavaScript" Oracle は Deno が署名活動を行い "JavaScript" の
Raspberry Pi 5 16GB RAMを頑張って使おうとしたけど、かなりムズい - あっきぃ日誌
先日ポチったRaspberry Pi 5 16GB RAMを、まずはDockerホストとdnsmasqサーバーの移行先として構築しましたが、無事メモリ使い切れず、16GBもいらんかったか……となっている今日このごろです。用途によってはしっかり使い切っているという人も見かけたりはしますが、いやあ普通にむずいですね。 現在のメモリ使用量 というわけで現在のメモリ使用量は…… 2GB。つまり空きは14GB。4GBモデルで足りるやないか！！！ 載せているものがなにもないのかと言えば、そんなこともないのですが、メモリ負荷が少ないコンテナばかりという説はあります。 コンテナホストなので、たとえば通常時のメモリ空き容量が残り2GBみたいなカツカツな運用をすると、コンテナのビルド時にメモリ不足で苦しむことになりそうなので、1/3くらいは余裕を持たせた状態で運用できればいいかなと思ってはいましたが、そもそも
【複数ユーザーのE2Eテストを楽に！】Playwrightで同時ログインを扱う方法 「管理者でログインしたあとに、一般ユーザーに切り替えて同じテストを続行したい！」 そんなときに便利なのがPlaywrightで 複数BrowserContext を使ったテストです。この記事では、上の動画でシェアしている内容をかいつまんで紹介します。 結論から 複数のBrowserContext を使うことで、同じテスト内で複数のユーザーをシミュレート可能 Playwrightのセッション保持の仕組みのおかげで「管理者→一般ユーザー」など、切り替えを行う際に ログアウト・ログイン をいちいち書かなくてもOK 番外編として forループ を使ってテストをスッキリ書くこともできる もっと詳しく知りたい場合や、実際の動きを映像で確認したい場合には、上の動画をご覧いただくのがおすすめです。 なぜ複数BrowserC
ひょえ〜！あのジョー・ゴールドバーグが帰って来る！ さあ、皆さん、ジョー ゴールドバーグの血なまぐさい物語のファイナルシーズンの準備はいいですか？何故なら、いよいよ【You 君がすべて】のファイナルシーズンであるシーズン 5 がこの4月に帰って来るからです、 このスリラーの最終シーズンの全10エピソードは4月24日に初公開されます。 今日は4月の公開に向けて最新情報をご紹介しますね。 ジョー役のPenn Badgley ペン・バッジリーも「毎シーズン、彼らはそれを面白く関連性のあるものにするために、なんとか新しいスペースを見つけています」と語っているように新しいものが見れるようですよ。それは、場所じゃないよ。 惨劇だよ。 今日Lyraが紹介するのは、Netflixで放送予定のアメリカ合衆国製作のTVシリーズ【You 君がすべて】のシーズン5です。 主人公役のペン・バッジリーが語るように 「
CypressとPlaywrightについて - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? cypressからplaywrightへテストツールを移行してみよう！ということになったので、それぞれのテストツールの違いや実際の移行方法についてまとめようと思います。 Cypressとは セットアップが簡単でシンプルなUIを持っているため、短時間でテスト環境を構築し、直感的に使いたい場合に向いています。 ブラウザ内でリアルタイムに動作し、デバッグも容易なとこがポイント。ただし、対応ブラウザとしてはChromiumベースのブラウザ（Chrome、Edge）、Firefox、WebKit（Safari相当）に対応しているものの、サポートさ
自分が生きてるうちにやりたいことって何だろう。 32歳になって、最近そんなことばかり考えている。 ジョブズのスピーチや「7つの習慣」では自分が死ぬ瞬間を想像してみよと言う。 実際にやってみたら自分の中に2つのことが思い浮かんだ。 【1】子供を持つこと ひとつは、自分の子をこの世に生み出すこと。 死ぬ瞬間、 「ああ、俺の人生、子供を作ってよかったなぁ」 と思うことはありそうだが 「ああ、俺の人生、子供がいなくてよかったなぁ」 とは思わなそうだなって。 それなら、やはり子供は欲しい。 子に関しては妻とも意見が一致している。 向こう数年のうちに、できれば一人目がほしい。 【2】コードで貢献すること 生きてるうちにやりたいこと、ふたつ目。 それは『コードで』人類に貢献し続けること。 最初にコードを書いたのは、高1の頃。 柴田望洋のC言語の本が手垢で真っ黒になるまでコードを写経した。学校の授業が終わ
PlaywrightとSeleniumの比較ガイド JavaScriptを使用している動的なウェブサイトをスクレイピングしたい場合、一般的に推奨されるのは、ブラウザ自動化ツールを使用することです。 この種のツールでは、コードを使ってブラウザを操作し、そのブラウザに表示される情報をスクレイピングできます。 PlaywrightとSeleniumでは、どちらがおすすめか？ 調査したところ、Playwrightの方が、上位互換のような印象を受けた & 使いやすくおすすめ🌟 PlaywrightとSeleniumの比較・Summary Playwrightは、セットアップの手間がSeleniumよりも少ないです。 PlaywrightとSeleniumは多くの言語でサポートされています。 Playwrightは、JavaScript/TypeScript、Java、Python、C#を公式にサポ
はじめに Java でリソースにアクセスする場合、file や jar といった URLスキームで参照することができます。 file:/path/to/resource.txt // ファイルシステム上のリソース jar:file:/path/to/foo.jar!/resource.txt // jarに固められたリソース モジュールシステムが導入されたモジュールシステムが導入された Java9 からは、上記以外に jrt というURLスキームを考慮する必要があります。 jrt というURLスキームは、jlink ツールで作成したランタイムイメージ(いわゆる JIMAGE)に含まれるリソースにアクセスする際に使用します。 URLスキーム jrt を考慮しない場合、開発時は動くものの、jlink でランタイムイメージとして固めたとたんに動かなくなってしまう、ということが発生します。開発時は
こんにちは。 苦しんでプログラミングを学んだ柴犬こと、くるしばです。 独学でプログラミングを学習し、Webサービス作りITベンチャーを起業しました。 その後個人開発したサービスを売却したり、また別のIT系の会社を創業したりしています。 下記のTwitterにてプログラミング学習に関して発信し、1.9万人以上の方々にフォローして頂きました。 また、最近はUdemyでReactとFlutterのプログラミング講座も出して、ベストセラーにも入っています。 初心者のうちは知らなかったが、学習を進めたり実務に入って経験が長くなってから 「こんな便利なものあったんだ...！」 となるツールってありませんか？ 僕はめちゃくちゃありました。 こういったツールは他の詳しい人から教えてもらうケースも多いので仕方がないのですが、もしこれらを初心者のうちに知ってたら色々楽だったのにな...と思うものが沢山あります
はじめに この記事では、Playwrightのfilter() についてをまとめております。 結論
![[Playwright] 高度なロケーターのfilter()種類と使い方](https://cdn-ak-scissors.b.st-hatena.com/image/square/121baa5da85c45b1a32bd8db97c499750608280e/height=288;version=1;width=512/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--PKr8GtCJ--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3A%25255BPlaywright%25255D%252520%2525E9%2525AB%252598%2525E5%2525BA%2525A6%2525E3%252581%2525AA%2525E3%252583%2525AD%2525E3%252582%2525B1%2525E3%252583%2525BC%2525E3%252582%2525BF%2525E3%252583%2525BC%2525E3%252581%2525AEfilter%252528%252529%2525E7%2525A8%2525AE%2525E9%2525A1%25259E%2525E3%252581%2525A8%2525E4%2525BD%2525BF%2525E3%252581%252584%2525E6%252596%2525B9%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_37%3A%2525E5%2525B0%25258F%2525E5%252580%252589%2525E3%252581%252582%2525E3%252582%252593%252520%252Cx_203%252Cy_121%2Fg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyL2FhZTc3ZDA0MzcuanBlZw%3D%3D%252Cr_max%252Cw_90%252Cx_87%252Cy_95%2Fv1627283836%2Fdefault%2Fog-base-w1200-v2.png)
『ごんぎつね』の最後の場面で「ごんは死んでいない」と読解する生徒が一定数いるという話… 一般的には「死んだ」と解釈されるごん “正しい読解"と"解釈の自由性"について考えさせられる問題 なぜヤン・ウェンリーと葛城ミサトはそっくりなのにまるで似ていないのか。｜海燕（オタクライター） 自分の知識をアップデートすることと、クラウド事業のありかたに関する自分なりの言語化 - inductor's blog マスク氏「政府機関全体を廃止」、トランプ氏推進の改革の一環 「従業員はなぜ会社を辞めてしまうのか？」その離職の要因を、心理的に体系化し、部下のタイプ別に分析して、それぞれの具体的な対応について書かれた実践的な本「離職防止の教科書」 全員5月14日までに対応必須、Google マップの「タイムライン」を残すには？ [てっぱんアプリ！] [第四十三話]サチ録～サチの黙示録～ - 茶んた | 少年ジャ
Playwrightでテスト対象のブラウザを設定する
▮1. playwright.config.tsのprojects:を変更する 操作 [エクスプローラ]playwright.config.tsを開く。 [テキストエディタ]以下の通りに、コードを 変更後 に変更する。 変更前 /* Configure projects for major browsers */ projects: [ { name: 'chromium', use: { ...devices['Desktop Chrome'], }, }, { name: 'firefox', use: { ...devices['Desktop Firefox'], }, }, { name: 'webkit', use: { ...devices['Desktop Safari'], }, }, /* Test against mobile viewports. */ // { /
現在Bot対策で大体の所で使用されている手法としてCaptchaと呼ばれる技術が使われています。 これはプログラムでは識別が難しく、人間にはほぼ難なく識別できる視覚や聴覚を使用して人間が考えることで解決することが出来るというものになります。 前述した通り、これはあくまでも難しいだけであり技術の進歩は素晴らしく現在ではほぼ難なくAIで解決できるようになっています！ ですが、画像識別には難がありあまりにも識別が難しいレベル(人間にも難問)だったりすると識別率が著しく下がる場合があり、そういった場合には別で強化学習や専用のモデルを作成しなきゃいけないというデメリットがあります。 その他にも識別するためにCPUやGPUのリソースを大きく消費してしまうなどの点が上げられます そのため今回では視覚障碍者向けのreCAPTCHA v2の救済措置の音声ベースのCaptchaをAIで解決していきます。 音声
WordPress 6.7.2 メンテナンスリリースについて WordPress 6.7.2 は、メンテナンスリリース(WordPress 6.7.2 Maintenance Release) となります。 今回の WordPress 6.7.2 では、システムコアとブロックエディターに関する35件のバグ修正に関するアップデートが行われています。 システムコアに関するバグ修正 システムコアに関するバグ修正は、以下の通りです。 #62534 - [管理] 管理画面でカテゴリ/タグ/プラグインのページネーションが壊れている #62110 - [ビルド/テストツール] AtomParser_Parse_Test::test_parse_sets_handlers が失敗する #62808 - [ビルド/テストツール] 古いブランチでの Puppeteerテストが失敗する #62843 - [ビル
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 1. Stagehandの機能詳細 Stagehandとは: Stagehandは、Webブラウザを自動操作するためのAI搭載フレームワークです。Playwright（Microsoft製のブラウザ自動化ライブラリ）を基盤として拡張しており、自然言語で指示を与えるだけでブラウザ操作を実行できる点が特徴です (@browserbasehq/stagehand - npm)。Stagehand自体は「インターネットへのAIインタフェース」と位置付けられており、複雑な抽象化を避けつつモデルに依存しない軽量なフレームワークを目指しています (I
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
なぜあなたのウェブサイトは遅いのか
話題のbrowser-use使ってみた - Qiita
個人開発から公式機能へ: PlaywrightとRailsをつなげた3年の軌跡
ECS上にE2Eテスト基盤としてPlaywrightによる実行環境を構築した
メルカリ ハロのインターンに2ヶ月参加してみて | メルカリエンジニアリング
Storybook Test runnerを活用した品質向上戦略とVRTの安定化
Release v1.50.0 · microsoft/playwright
Thoughts On A Month With Devin – Answer.AI
Deno in 2024
Developers Summit 2025 公開資料・Xアカウントリンクまとめ
2025-02-01のJS: Bun 1.2、Tailwind CSS v4.0、TypeScript 5.8 Beta
JavaScriptライジングスター2024 - Qiita
playwrightのsnapshotでmask以外の方法で要素を隠す
これはもう実質AGIでは? AIが勝手にブラウザを操作していろいろやってくれちゃう BrowserUseが爆誕｜shi3z
Playwrightでのウェブスクレイピング - 2025年版ガイド
Next.js,PrismaのE2EテストをGitHub Actionsで自動化
Playwrightで複数ユーザーを使ったテストが素敵に書ける
【YOUー君がすべてー】シーズン5 配信決定:最新情報と予告映像紹介 You (TV series) | Mind You
評価面談前日でナーバスになり、長文を書いてしまった。 - らぼらとり
Pythonでスクレイピングする際のライブラリ選定など・調査まとめ
Java ランタイムイメージ用の新しいURLスキーム jrt について - A Memorandum
もしプログラミング初心者に戻れたら、初めから使っておきたかったツール36個
[Playwright] 高度なロケーターのfilter()種類と使い方
2025/02/14(金)の出来事 - My Bookmark
AIを使って無料でreCAPTCHA v2を突破する(音声版、Python)｜神瀬 来未
WordPress 6.7.2 にアップデート完了しました！
PlaywrightにAI機能を追加したStagehandとはなにか? - Qiita