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
GitHub - microsoft/playwright-cli: CLI for common Playwright actions. Record and generate Playwright code, inspect selectors and take screenshots.
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
CloudflareのDeveloper Week 2023の気になった発表のまとめ - console.lealog();
今年も祭りの季節がやってきましたね。 Developer Week 2023 | Cloudflare というわけで、今年も個人的に気になったものを。 （発表されるのがだいたいJST深夜かつ最後が金曜日なので、どうやっても公開するの週明けになるんよな・・） Introducing Constellation, bringing AI to the Cloudflare stack https://blog.cloudflare.com/introducing-constellation/ Workersで機械学習のモデルが動かせるようになったとのこと プライベートβ サポートされているランタイムで動作するモデルであれば、自作のものでも、用意されてるものでもOK 現状はONNX形式のみ対応 https://github.com/onnx/models https://github.com/d
ビジュアルリグレッションテストにChromaticを導入したらデザインレビューが捗った話 - Money Forward Developers Blog
マネーフォワード関西開発拠点エンジニアの @uenoY4 です。 現在、私のチームではフロントエンドに Next.js を使用したプロダクトの開発をしています。 その中でリファクタリングなど既存実装に修正を加えた際に、意図しないUIの崩れが起きることを防ぎたいという思いから、ビジュアルリグレッションテストを行うようにしました。今回はビジュアルリグレッションテストを行うために導入したChromaticについてお話しします。 目次 ビジュアルリグレッションテストとは Chromaticとは Chromatic導入のきっかけ 実際導入してみて まとめ ビジュアルリグレッションテストとは ビジュアルリグレッションテストとは、ページの見た目をテストする仕組みで、変更前のページやコンポーネントの画像と変更後の画像を比較して検証を行います。要素のサイズや配置などのピクセルレベルの変更やテキスト色、背景色
Puppeteer, Selenium, Playwright, Cypress - how to choose? - AI-driven E2E automation with code-like flexibility for your most resilient tests
Puppeteer, Selenium, Playwright, Cypress – how to choose? At Testim, a lot of what we do is build AI-based features on top of automation frameworks to add stability,… At Testim, a lot of what we do is build AI-based features on top of automation frameworks to add stability, accelerate test creation, and improve root-cause analysis. We evaluate a number of test automation frameworks to understand
Serenity/JS | Serenity/JS
Enable collaborative test automation at any scale!Serenity/JS is an innovative test automation framework designed to help you create high-quality, business-focused test scenarios that interact with any interface of your system and produce comprehensive test reports that build trust between delivery teams and the business. Make your tests speak your languageSerenity/JS Screenplay Pattern helps you
「フロントエンド開発のためのテスト入門」の感想
同じ時期に Jest 本（Jest ではじめるテスト入門）を書いていたので、他の方はどのようにテストについて書くのか気になったので読んでみました。 Jest 本との比較 Jest 本と比較し、「フロントエンド開発のためのテスト入門（歯車本と呼ぶそうです）」は Jest の説明など重複している部分はありましたが、特徴が全く違うと感じました。 Jest 本では、CircleCI で働いていたのが大きいのですが「テストを機能させるにはどうすればいいのか？」というのを強く意識して書いていました。そのため、Jest でテストを書くために必要な情報以外に、ブランチモデルや CI、プロジェクトへのテストを導入する際のアプローチなどを紹介しています。そして、寄り道が多いです。JavaScript の仕様や Jest の歴史、CircleCI での体験談などのコラムが充実しています。全然意識していたわけでは
Service WorkerとCache APIによるWebサーバーの負荷軽減とテスト実装について-後編 - dwango on GitHub
2023-03-06 Mon Service WorkerとCache APIによるWebサーバーの負荷軽減とテスト実装について-後編 ニコニコQセクションのHajime-san(GitHub)です。 本記事は、Service WorkerとCache APIによるWebサーバーの負荷軽減とテスト実装について-前編の続きとなります。 テストについて さて、前編のService Workerスクリプトの実装はローカル開発環境および検証環境での確認を経て本番環境にデプロイされているのですが、このままでは「なんとなくキャッシュが動いている」という状態がブラウザ上に構築されていることになるので、Service Workerの振る舞いの仕様書となるテストコードが欲しいというのが本稿のもう1つの主題になります。 Service Workerのテストについては筆者が知る範囲ではインターネットにはあまり知
Fast and reliable cross-browser testing with Playwright 🎭
Web developers today are shipping faster. Web apps are becoming increasingly sophisticated and run across all devices — our phones, tablets and desktops — each running a different browser engine. This increase in velocity and targets puts immense pressure on the testing process: automated cross-browser testing has become more important than ever. Automated end-to-end tests can be incredibly powerf
プロダクトエンジニアリング部の海老澤です。 普段は LIFULL HOME'S の賃貸部門のフロントエンド開発をしています。 近年、LIFULL の開発部門では「開発生産性」という言葉が取り沙汰されるようになりました。 LIFULL HOME'Sの主要リポジトリは10年以上運用され続け、今も多くの開発者によって日々改修され続けています。 長い年月の中で小さな設計ミスも積み重なって大きくなり、ちょっとした実装でも入念な調査が必要となり開発生産低下の要因となっていました。 また10年以上前に採用したフレームワークで稼働しているため、今ではドキュメントを探すのも一苦労という具合です。 そこで主要開発部門では「自部門の機能はマイクロサービスへと切り離し、各々で面倒を見る」という方針になりました。 賃貸部門も同様に機能の切り離しを始め、先日「物件詳細ページ」のマイクロサービス化を行いました。 今回は
mablからPlaywrightに移行しました - LegalOn Technologies Engineering Blog
こんにちは！ 株式会社LegalOn TechnologiesのLegalForceキャビネ開発部SET（Software Engineer in Test）のひきもち（@rmochioo）です。 昨年8月に入社し、LegalForceキャビネのAPIテスト、自動E2Eテストなどの自動テストの導入、QA業務まで幅広く携わっております。 APIテストに関しては先日、記事出ていますのでご興味があれば見ていただければと思います。 tech.legalforce.co.jp LegalForceキャビネではE2Eテストの自動化ツールとしてmablを利用していましたが、この度Playwrightへの移行を行いました。 現在LegalForceキャビネで運用しているE2Eテストは全てPlaywrightで実行されており、リリース可否判断やQA環境でのマニュアルテストのサポートとして利用されています。
【株式会社ラクス】SaaSプロダクト別の技術スタックを一挙公開！ - RAKUS Developers Blog | ラクス エンジニアブログ
（本記事は2023/10/2時点の情報にアップデートしております） こんにちは、技術広報のyayawowoです。 突然ですが、株式会社ラクスと聞いて何を思い浮かべますでしょうか？ 弊社ラクスでは、様々なプロダクトを展開していますが正直認知度は低いと思っております。 そこで今回、弊社についてもっともっと知っていただくため・・・ ラクスが展開している全10プロダクト 全10プロダクトの技術スタック インフラ/SRE/デザイナーの技術スタック について、ご紹介させていただきます！ SaaS開発に携わる方、弊社に少しでも興味を持っている方の一助となれば幸いです！ ラクスが展開している全10プロダクトとは？ バックオフィス向け フロントオフィス向け 10プロダクトの技術スタック 楽楽販売 楽楽精算 楽楽明細 楽楽電子保存 楽楽勤怠 MailDealer 配配メール Curumeru blastmai
2024/02/21 ビジュアルリグレッションテストツール４選！ユーザーが語る各ツールのメリット で発表したスライドです。 https://trident-qa.connpass.com/event/308664/ 参照したURL - https://playwright.dev/docs/test-snapshots - https://zenn.dev/mh4gf/articles/tiny-vrt-with-github-actions - https://tech.route06.co.jp/entry/2023/03/29/080000
タイトルの通りこの hiroppy.me のサイトを 1 から刷新し、そこにブログページが入ったことによりブログもはてなから移管することにしました。 特に意識してなかったのですが、はてな ブログの方が、ちょうど 100 記事目の時に移行するという流れになってしまいました。。 はてな ブログは有料会員で 4 年間ぐらいやっていたのですが、最近は使えておらず、そうなると当初の目的である独自ドメインでのはてブ通知も今はあまり必要なくなりました。 また、ブログの名前が技術探しですが、最近はプライベートの話や技術を昔以上に探せてない点があり、もう自分としては役割を終えたのかなと思っています。 359 人の方に購読してもらい、多くの方に閲覧してもらって本当にありがとうございました。1 年半も技術の記事を投稿していなかったのに未だにアクセスがあり、嬉しく思います。 過去の記事もこちらへ移動させてますが、
ビジュアルリグレッションテストのすすめ
日々いろいろなWebサイトの制作や修正を対応していく中で、修正したページとは関係ない（と思っていた）ページで表示が崩れてしまったことってありませんか？ 私はたびたび経験があります。 毎回目視で全ページをチェックすれば防げるのかもしれませんが、それは現実的ではありません。 自動で全ページをチェックしてくれて不具合があれば教えてくれる、そんな便利なツールがあればと何度も思いました。 どうやら現代の技術でそれは作れるみたいです。ビジュアルリグレッションテストというらしいです。 ビジュアルリグレッションテストとは ざっくりいうと「見た目の比較」をするテストのことです。 変更前のWebサイトのスクリーンショットを用意しておき、変更後のスクリーンショットを撮り比較することで、どこが変わったか差分を表示し確認することができます。 どうやって使うの ビジュアルリグレッションテストを導入するための方法はいく
vuefes.jp 一日セッション見つつメモを残したので、個人ブログに放り投げておく。 殴り書きなので何の清書もしてないし、誤字脱字もチェックしてないです！！！ Keynote | The Evolution of Vue / Evan You https://vuefes.jp/2022/sessions/yyx990803 0.x系の Pre バージョン時代の話 ES5のみのFeatureを前提にする必要があった 1.0のコードネームってEvangelionだったのか.. 2015-2016でのコアなライブラリ群の追加が多かったらしい。Vue Router とかVuex 大規模SPAアプリケーションの構築の解決狙い Vapor Mode Virtual DOM への依存がない パフォーマンス特化でのプリビルド 今後 Vue2→3の移行期という認識 30%が Vue3, 25%が 2.7
2023年6月27日に開催されたFLEXY meetupのテーマは「フロントエンドのテスト」です。 技術の進化とともにバックエンドとフロントエンドが疎結合になる今、フロントエンド領域ではテストの重要性が高まっています。 一方、現場レベルではテストコードを書いたことがなく、何から始めるべきなのか悩みを抱えているエンジニアは多いのではないでしょうか。 そこで今回は、実際にフロントエンドのテスト導入を行っている古川さん、nus3さんの2名がディスカッション。「フロントエンドテストはじめの一歩」として今、何ができるのかを実例も交えながら教えていただきました。 イベント概要 技術の進化に伴い、アーキテクチャレベルでバックエンドとフロントエンドが疎結合になった今、フロントエンド領域におけるテストの重要性について注目が集まっています。 一方でまだ手法が広まっておらず実際にテストコードを書いたことがないた
![フロントエンドテストはじめの一歩 [FLEXY meetupイベントレポート] - FLEXY（フレキシー）](https://cdn-ak-scissors.b.st-hatena.com/image/square/61e23c19faa14a56ce4e6b940ca5ce2e6f726ac8/height=288;version=1;width=512/https%3A%2F%2Fflxy.jp%2Fmedia%2Fwp-content%2Fuploads%2F2023%2F07%2F3bfdf32ad90ed12f36456c563abc807d-e1689937462143.png)
ZOZOTOWNのマーケティングプラットフォームでのフロントエンドの取り組み - ZOZO TECH BLOG
はじめに こんにちは、MA部の林（@hayash__p）です。 私達のチームでは、メール、LINE、Push通知、サイト内お知らせなどでユーザにZOZOTOWNのセールや新着商品を紹介するといった、マーケティングに関わるシステムを開発しています。これまで、配信チャネルや配信内容ごとに個別最適化したシステムを開発していましたが、それらを一新したマーケティングプラットフォームを作ることになりました。新しいマーケティングプラットフォームであるZOZO Marketing Platform（以下、ZMP）の概要については以下のテックブログをご覧ください。 techblog.zozo.com 本記事では、マーケティングプラットフォームのリプレイスにあたり、フロントエンドエンジニアとして取り組んだことを紹介します。 目次 はじめに 目次 背景 ZMPの管理画面モジュール MPマネージャー 技術選定 M
Visual Regression Testing はじめました - 具体的な運用 Tips | Recruit Tech Blog
こんにちは。スタディサプリ ENGLISH Web フロントチームの kazuma1989 です。 先日、私たちのチームは開発フローに Visual Regression Testing を導入しました。Visual Regression Testing は、フレームワークを紹介する記事は見つかるものの、具体的な知見があまり広まっていない印象なので、具体的な設定値や選定理由も含め紹介してみます。 React による Web フロント開発を前提にしていますが、Visual Regression Testing のコア部分は「画像の比較」であるため、他のプラットフォーム開発でも参考になればと思います。 Visual Regression Testing (VRT) とは Visual Regression Testing （日本語で 画像回帰テスト、以下 VRT）は、画像の差分を検出する、スナ
JSer.info #488 - TypeScript 3.9がリリースされました。 Announcing TypeScript 3.9 | TypeScript Promise.allの型推論がされています。 また3.9 β時点では導入される予定だったawaitedは問題が見つかったため、3.9時点では導入されないことになりました。 その他にはビルドパフォーマンスの改善、Type Errorとなることを期待する// @ts-expect-errorコメントの追加などが行われています。 JSへとコード変換における非互換な変更として、クラスのGetter/Setterをenumerable: trueに変換するのではなく、enumerable: falseに変換する変更が含まれています。 これは、ECMAScriptの仕様で定義されているのと同じ挙動で、Babelも同様の挙動です。 Type
Qwik Reaches v1.0
The Qwik team is excited to announce that Qwik has reached v1.0. Qwik is a full-stack web framework that brings a fundamentally new approach to delivering instant apps at scale! Frameworks such as React, Vue, Angular, Svelte, SolidJS, and their meta frameworks (Next.js, Nuxt, SvelteKit, SolidStart, Astro) have revolutionized web development by providing powerful tools and abstractions that simplif
後回しにされがちな問題を改善するための「改善デー」「やさしさデー」のご紹介 #LayerXテックアドカレ - LayerX エンジニアブログ
こんにちは。バクラク申請・経費精算エンジニアの@upamuneです。12/24日のM-1グランプリの敗者復活戦を軽い気持ちで見に行ったら、パイプ椅子に7時間座ることになって腰がやられました。 この記事はLayerXテックアドカレ2023の43日目の記事です。 私はなぜか3日分もテックアドカレに入れてしまったのですが、3回目の今回は「改善デー」「やさしさデー」という取り組みの話を紹介しようと思います。 「改善デー」とは 弊チームでは「改善デー」という名前のイベントを約1ヶ月に1度のペースで開催しています。これは、チームメンバーが「普段改善したいと思っているけど、中々できていないことをやる日」です。 実施に至った背景としては、主に以下の2点がありました。 シビアに優先度を検討した結果、機能開発の優先度が上がり改善に手を付けられていなかった ロードマップでは開発リソースのN%を「やさしさ対応」(
Historical expertise provided by Jerry Beck, Amelia Cook, Jason DeMarco, Maureen Furniss, Monique Henry-Hudson, Willow Catelyn Maclay, Linda Simensky, Koji Yamamura Entries by Rebecca Alter, Elly Belle, Kambole Campbell, Jen Chaney, Amelia Cook, Alex Costello, Marley Crusch, Toussaint Egan, Christopher L. Inoa, Genevieve Koski, Willow Catelyn Maclay, Rafael Motamayor, Sammy Nickalls, Joshua Rivera
APIテストで質とスピードの両立を実現 - LegalForceキャビネの事例 - LegalOn Technologies Engineering Blog
こんにちは、株式会社LegalOn TechnologiesのLegalForceキャビネ開発部でQAリードを務めている島根（@shimashima35）と申します。 QAというとマニュアルテストが中心かと思われるかもしれません。確かにマニュアルテストはQAの業務の一部ではありますが、「質とスピードの両立」つまりプロダクト品質の高さとリリーススピードの両立を目指すため自動テストの導入もおこなっています。 今回はLegalForceキャビネのバックエンドに対するAPIテストを実装した話をご紹介します。 APIテストとは まず最初にAPIテストについて説明します。 APIテストの概要 APIテストとはWeb APIの外形的な仕様を満たしているかを HTTP(S)を用いてテストすることです。バックエンドのコントローラーに対するユニットテストとは以下の点が異なります。 HTTP(S)を経由する デ
『君の名は。』への評がいかに快挙か；訳文と感想（ネットで読めるグレッグ・イーガン氏の映画・創作観） - すやすや眠るみたくすらすら書けたら
録り貯めたお正月の特番を消化しているかたのなかには、３が日に地上波初放送された『天気の子』や８日新年一発目の『金曜ロードSHOW!』神木隆之介さんなど豪華吹替キャストによる『パラサイト』をご覧のかたもいらっしゃるんじゃないでしょうか？ 今回の記事は、そんな新海誠監督の前作で神木氏主演『君の名は。』にたいするグレッグ・イーガン氏の評価がいかにすごいか、氏のインタビューやエッセイ（『Avatar Review（「アバター」批評）』『No Intelligence Required Her, Ex Machina and Interstellar（知性は不要――「her／世界でひとつの彼女」、「エクス・マキナ」そして「インターステラー」にとって）』）などを勝手に訳して、氏の映画観・創作観と比べることで確かめてみようという感じのやつです。 訳文本文7700字｛2230字＋5529字（原文730語＋
ベンチャー企業でQAチームを立ち上げました
1. はじめに Social Databank Tech Blog Advent Calendar 2023の5日目です。 今回はSocial Databank（以下SDB）でQAチームを立ち上げた話をします。 SDBにQAチームができたのが1年前。それまでQAという組織が存在せず、各メンバーがそれぞれの機能・コードをレビューし、リリースを行なっていました。 そのため、サービスの規模や開発メンバーが増えるにつれて以下の課題が発生しました。 品質が各メンバー・PJに依存する a. 検証項目が作成する人によって粒度が変わる b. テストコードを書くPJとそうでないPJがある c. 仕様が特定のメンバーに属人化している 品質に関するルールや規定がない a. 障害が発生しても有識者が場当たり的に対応している b. リリースに関する判定基準がない 以上の理由から、QAチームを立ち上げ組織全体の品質向
Storybook is the industry standard workshop for building, documenting, and testing UI components. It’s used by leading development teams at organizations like Shopify, Gov.UK, and NASA. One of the biggest benefits of developing in Storybook is that you get tests for free. Each isolated component example—or “story”—is a UI test. And if you want to test data fetching and user interactions, Storybook
Next.js の getServerSideProps & API Routes テスト手法についてまとめました。getServerSidePorps & API Routes に関するテストは「Cypress・Playwright」を利用することが多いと思いますが、本稿は Jest 単体テストの紹介です。以下はテストに使用するエコシステム一式です（Jest 等は略） msw node-mocks-http next-test-api-route-handler testing-library 1.pageExtensions を設定する 本題に入る前に、pageExtensions を next.config.jsに設定します。pageExtensions はpagesに含まれるファイルのうち、指定の拡張子をもつファイルが「Page・API 実装ファイルである」ことを指定するものです。
Remixで個人開発をしたので技術スタックを紹介
しおりモ！ まずは開発しているサービスの紹介をします。 「しおりモ！」は本に関するメモをいい感じ（当社比）に記録するためのサービスです。元々読書中に気に入ったセリフや後から読み直したい箇所を手帳や他のサービスにメモしていました。しかし、あとで見返すときにどの本のどのページか分かりづらい/検索がしづらかったので、自分が使いやすいサービスを開発することにしました。一応本についてのメモとは謳っているものの、通常のメモ帳サービスとしても使えるはずです。 まだ初期機能（メモの追加、編集、削除と検索）の実装が終わった段階です。これからも細かい機能追加を色々したいとは思っています。ただ、とりあえず自分で使う分には最低限のところは終わったので、あとはのんびりやっていくつもりです。SEO対策とかOGPの設定はしていません。 よかったら使ってみてください。 メモの作成 メモの検索 メモの編集 Remix せっ
Tips, tricks, and in-depth guides from the trenches. Learn how to use the popular open-source browser automation frameworks, Playwright and Puppeteer. This guide provides detailed information and examples how you can write high-quality scripts for testing and synthetic monitoring. Getting Started Have a look at how Playwright & Puppeteer work, what similarities they share, as well as the noticeabl
PlaywrightをGitHubActions実行したときの初期処理についての試行錯誤 | フューチャー技術ブログ
Playwright連載5日目です。 近年PlaywrightやCypressを用いたE2Eテスト（エンドツーエンドテスト）が行われるようになってきました。 E2Eテストとはソフトウェアやシステムの全体的な動作や機能をテストする手法で、ユーザーが実際に行う操作を模倣したテストを行い、アプリケーションが予想通りに機能するかどうかを確認していきます。 具体的な操作手順をテストケースとして作成し、予期される結果との整合性を確認していくわけです。バグの早期発見のためにも、E2Eテストの自動化を行い、さらにはCIに組み込み定期的に実行していきたい。そしていざ組み込んでみると、CIの実行時間が気になってきます。 テスト自体の実行時間も短縮を行っていきたいですが、テストが始まるまでのイニシャライズ、初期処理の時間もそこそこ掛かってしまうもの。 今回はどのように設定していけば処理時間が短くなるか。試行錯誤
実はOffersMGRでもDatadog Synthetic Test を用いてテストを行っていました。 しかし、シナリオが2つしか無くカバー範囲も狭く、デグレが起こっても検知出来ない状況でした。 今回のPlaywrightを使ったE2Eテストの導入では既存シナリオの移行とOffersMGRの全ページが健全に動作しているかのチェックを目的としました。 今後を見据えた設計と運用 BtoCももちろんですが、BtoBのプロダクトは特に成長していくとともに安定したサービス提供が求められるのでテストの重要度は高くなります。 そのため、E2Eテストや結合テストの拡充は必然的に実施していくことになります。 一応、特定のComponentに対象を絞る事によってE2Eテストでも結合テストが出来ます。 しかし、E2Eテストは結合テストと比べ実行速度が遅く、最終的なテスト量はE2Eテスト < 結合テストが理想で
Lost Pixel Lost PixelとはWeb UIのビジュアル回帰テスト(VRT)のためのツールであり、キャプチャの撮影と差分の検出を一つのプロセスで行うことができるオープンソースライブラリです。 Web UIのVRTというと、storycap + reg-suit や、Playwrightのスナップショット機能、または Chromatic のようなサービスを思い浮かべる方も多いと思いますが、まさにそれらの類似ツールにあたるものであると捉えていただいて差し支えありません。 本記事では具体的な導入手順などは省き、Lost Pixelの特徴や他の類似ツールとの比較、または筆者の用途とカスタマイズについて紹介します。 記事を読んで、実際に導入を検討される場合のインストール方法やセットアップに関しては、公式のドキュメントを参照してください。 また、Lost Pixelにはプラットフォームモ
Register now for a full day of community, learning, and all things Visual Studio Code April 2022 (version 1.67) Update 1.67.1: The update addresses this security issue. Update 1.67.2: The update addresses these issues. Downloads: Windows: x64 Arm64 | Mac: Universal Intel silicon | Linux: deb rpm tarball Arm snap Welcome to the April 2022 release of Visual Studio Code. There are many updates in thi
JSer.info #664 - Rollup 4.0.0がリリースされました。 Release v4.0.0 · rollup/rollup Node.js 14/16のサポート終了、Acornの代わりにSWCをパーサに使うように変更されています。 SWC利用に伴うオプションの削除や非推奨なオプションの削除などが含まれています。 Viteの現在と今後についてがViteConfで発表されています。 動画: https://viteconf.org/23/replay/vite_keynote スライド: State of Vite (ViteConf 2023) ViteはDevビルドにesbuild、ProdビルドにRollupを使うためビルド結果に差異が出やすいなどの問題があります。 そのため、Rollup互換を意識したRolldownというBundlerをRustで開発するという話。
リモートワークスタイルチェック リモートワークスタイルに関する質問に答えることで、リモートワーク比重・文化がどういった具合かを確認・共有できるサービスを作った。 remote-work-style-check.mugi.dev こんな感じ↓の質問にぽちぽち答えるだけで良いので、すぐ終わる。簡単。 全部答えると↓のような全てをまとめたいい感じの1枚画像を表示してくれる。 もし忙しくなければチェックをやった上で、結果ページから結果をツイートして拡散してもらえるととても嬉しい。 チェック結果の画像も誰でも自由に使ってOK。 サービス内での項目は以前公開した "リモートワークスタイルチェック" の内容に沿っている。 🔗 リモートワークスタイルチェック · GitHub 🔗 "リモートワーク"の認識ズレ解消のためにリモートワークスタイルチェックを作ってみた - memo_md チェックに答えた結
Safetest is a powerful UI testing library that combines Playwright, Jest/Vitest, and React for a powerful end-to-end testing solution for applications and component testing. With Safetest, you can easily test the functionality and appearance of your application, ensuring that it works as expected and looks great on all devices. Safetest provides a seamless testing experience by integrating with yo
The Workers Browser Rendering API allows developers to programmatically control and interact with a headless browser instance and create automation flows for their applications and products. Since the private beta announcement, based on the feedback we've been receiving and our own roadmap, the team has been working on the developer experience and improving the platform architecture for the best p
WebのE2Eテスト自動化〜ツール選定編〜
こんにちは！ 株式会社ココナラのプロダクト開発部 QA チーム所属のまると申します。 弊社では現在リリース時のリグレッションテストの大部分を手動かつモンキーテストで実施しています。そのためテスト工数が高く、さらにテスト漏れも発生し、予期せぬ機能で障害が発生してしまうことがありました。 この状況を鑑み、QA チームではテスト効率化とプロダクト品質の更なる向上を目指し、今期からWeb の E2E テスト自動化を再整備しています。 本記事で自動化ツールの評価を行い、Playwrightを選定するまでのプロセスを記載します。 前提 テスト自動化ツールAutifyを利用して、定性的に重要と判断された一部機能を対象にリグレッションテストを自動化している 現状の課題 ツール制約上、対応できない機能が発生している 現状の自動化率は 50%未満 全テストケースを実行するとテスト実行完了までに半日要する 画面
フロントエンド:単体テストの観点
対象読者 Jest や Testing Library のテストの書き方は理解しているが、何をテストすべきかわからないという方。 動機 近年、フロントエンドでもテストを書くことが重要視されるようになってきました。 テスト導入する際、共通で利用するコンポーネントや関数などをテストする記事は多いですが、何をテストすべきかについての記事が見当たらなかったため、私が意識してるテスト観点を執筆しようと思いました。 まず初めに各種テストの説明 単体テスト 関数やメソッドなどの最小単位の部分を個別にテストする手法のこと。 利用ツール例 Jest React-Testing-Library 結合テスト 複数のコンポーネントが、互いにうまく動作していることをテストする手法のこと。 利用ツール例 Jest React-Testing-Library End to End （E2E）テスト ユーザーが実際にシス
Microsoft Releases Playwright Cross-Browser End-to-End Test Runner
How to Use Multiple GitHub Accounts Git is a popular tool for version control in software development. It is not uncommon to use multiple Git accounts. Correctly configuring and switching Git accounts is challenging. In this article, we show what Git provides for account configuration, its limitations, and the solution to switch accounts automatically based on a project parent directory location.
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
LIFULL HOME'S 賃貸物件詳細ページの基盤刷新について - LIFULL Creators Blog
Playwright で一番小さく始める VRT と、次のステップの選択肢
Astroでサイトを作り直し、ブログをはてなから移管しました - hiroppy's site
📝 Vue Fes Japan Online 2022 / 見たセッションメモ - memo_md
フロントエンドテストはじめの一歩 [FLEXY meetupイベントレポート] - FLEXY（フレキシー）
2020-05-18のJS: TypeScript 3.9、Deno 1.0、Playwright 1.0
The 100 Most Influential Sequences in Animation History
Portable stories for Playwright Component Tests
Testing Next.js - getServerSideProps & API Routes -
Learn Playwright & Puppeteer | Checkly
E2Eテストを導入した時に考えた設計と実装と運用について | Offers Tech Blog
VRTツールとしてLost Pixelを使ってみたらいい感じだった
Visual Studio Code April 2022
2023-10-10のJS: Rollup 4.0.0、Viteの今後(Rustify Vite)、pnpm v8.9.0
リモートワークスタイルチェック用サービスをつくった #リモートワークスタイルチェック - memo_md
GitHub - kolodny/safetest
Workers Browser Rendering API enters open beta