実装例から見る React のテストの書き方 - Cybozu Inside Out | サイボウズエンジニアのブログ
2024/04/17: 更新 内容を更新した記事を書きましたので、よかったらこちらも併せて、ご覧ください。 zenn.dev こんにちは！フロントエンドエキスパートチームの@nus3_です。 kintone のフロントエンド刷新プロジェクト（フロリア）では、品質を保ったまま開発を加速させるためにフロントエンドのテストを積極的に行っています。 今回はそんなフロントエンドのテストの実装例をいくつか紹介します。この記事がフロントエンドのテストを行う上での参考になれば幸いです。 テストに使用する主なパッケージ コンポーネントのテスト 補足: Testing Library の記法をチェックしてくれるeslint-plugin-testing-library カスタムフックのテスト 補足: React v18 では @testing-library/react の renderHook を使う 参考
ブラウザ拡張のE2Eテストを検討してみた（Playwright、Puppeteer、Cypress） - Techtouch Developers Blog
この記事はテックタッチアドベントカレンダー 8 日目の記事です。 フロントエンドエンジニアの taka です。Amazon Black Friday でフットウォーマーを買ったのですが、冷え性の自分には最高でした。冷え性の方には是非使ってみてもらいたいです。 今回は、モダンなツールである Playwright と Puppeteer、Cypress を実際に触ってみたので、そこから得られた知見を紹介したいと思います。 要件の整理 一般的な要件 テックタッチ特有の要件 機能ごとの比較 テストツールの有無 複数タブ / ウィンドウ ShadowDOM ブラウザ拡張 要素の特定 スクリーンショット 動画 実行速度 まとめ 要件の整理 テックタッチはブラウザ拡張であるため、一般的な Web アプリケーションとは少し要件が異なってきます。以下に、一般的な要件とテックタッチ特有の要件を書き出しました。
Home
Real MocksThe creation of mocks is done during TypeScript compilation and preserves all type information. ExtendibleThis library can be used with any testing framework. You can even provide your own implementation! Type SafetyNo more casting to 'any' to get your spy or mock. This library provides a mechanism to inject your spies while preserving their types.
Root Cause Analysis - AI-driven E2E automation with code-like flexibility for your most resilient tests
Root Cause Analysis Troubleshoot your tests fast, with the information you need, where you need it. Tests break. When they do, you need to find the root cause quickly. Is it an application bug? An outdated test? A network delay? Time spent troubleshooting failed tests slows your release cycles and reduces your ROI.
Playwright
Playwright enables reliable end-to-end testing for modern web apps. Cross-browser. Playwright supports all modern rendering engines including Chromium, WebKit, and Firefox. Cross-platform. Test on Windows, Linux, and macOS, locally or on CI, headless or headed. Cross-language. Use the Playwright API in TypeScript, JavaScript, Python, .NET, Java. Test Mobile Web. Native mobile emulation of Google C
GitHub - qawolf/qawolf: 🐺 Create browser tests 10x faster
At QA Wolf, we’re building the magical QA experience that we wanted when we were managing engineering teams. With zero effort on your part, we get you to 80% automated test coverage in 4 months — and keep you there. We plan. You’ll get a test matrix covering every user flow in your web app, from happy path to edge case and everything in between. We automate. Using vanilla, open source Microsoft Pl
GitHub - kiranz/just-api: :boom: Test REST, GraphQL APIs
Runs test suites in parallel/serial mode Supports all widely used HTTP methods Supports x-www-form-urlencoded requests, Multipart requests, File uploads Built-in Response Validation Constructs(Headers, Cookies, Status code, JSON body, JSON schema) Custom Response validator functions Supports running custom inline or module javascript sync/async functions Supports Hooks (Before All, After All, Befo
これだけは覚えたい、ユニットテストを書くための４つのデザイン - Qiita
もうちょっと規約的なものを「JavaでのUT作成基準を整理してみた」にもまとめてみました。 はじめに 去年、ブログの方に「ふつうのユニットテストのための７つのルール」という記事を書いたのですが、思ったより反響がありました。 あの記事で書いたのはあくまで原理・原則で、それを実現するためにはいくつかのテクニックが必要です。 特に、ああいうルールを作って「ユニットテストを書く事」を厳守するようにしても、 適切なテクニックを知らなければメンテが困難だったり、品質に寄与しなかったり、実行性能が悪いゴミが量産される可能性があります。 じゃあ、どうすれば良いかというと「最初からユニットテストが書きやすいように元のコードを設計する」ということです。 そう。まず身に付けるべきは「テストコードの書き方」では無く「テスト対象コード」すなわち「プロダクトコードの書き方」なのです。 また、ここで言ってる「最初から」
badssl.com
badssl.com 🎛Dashboard Dashboard 🎫Certificate expired wrong.host self-signed untrusted-root revoked pinning-test no-common-name no-subject incomplete-chain sha256 sha384 sha512 1000-sans 10000-sans ecc256 ecc384 rsa2048 rsa4096 rsa8192 extended-validation 🎟Client Certificate Certificate Downloads client client-cert-missing 🖼Mixed Content mixed-script very mixed mixed-favicon mixed-form ✏️HTTP h
Home - Test Anything Protocol
Test Anything Protocol TAP, the Test Anything Protocol, is a simple text-based interface between testing modules in a test harness. It decouples the reporting of errors from the presentation of the reports. One of its major uses is for noise reduction; when you have a suite of many tests, making them TAP producers and using a TAP consumer to view them helps ensures that you will see everything you
テスト書きすぎ問題を避ける - Qiita
新しい職場で提案したら歓迎されたので投稿しておく。 テストコード開発方針 漫然とテストコードを書いていると、以下のような問題が発生することがある。 テストに時間がかかりすぎ、待ち時間が発生したり、テスト結果を見なくなったりする テストコードの開発とレビューに時間をかけたが、そのコストに見合う利益を得られない このような問題を避けるため、以下の方針を定める。 ビジネス上の価値に比例したテスト コードの価値をビジネスへの影響や回避方法の有無により以下のようにランク付けする。 メジャー サービスの主たる機能に影響する 再現条件が広い 回避方法がない／あっても自明でない マイナー サービスの副次的な機能に影響する 再現条件が限られる 回避方法がある トリビアル サービスには影響しない 違和感はあるが、不便を感じない 回避する必要がない 複数のランクに該当する場合、より多く該当するランクに分類する。
Mocha - the fun, simple, flexible JavaScript test framework
simple, flexible, fun Mocha is a feature-rich JavaScript test framework running on Node.js and in the browser, making asynchronous testing simple and fun. Mocha tests run serially, allowing for flexible and accurate reporting, while mapping uncaught exceptions to the correct test cases. Hosted on GitHub. # SponsorsUse Mocha at Work? Ask your manager or marketing team if they’d help support our pro
テストがないJS環境にモダンなテスト環境を導入していく - Qiita
Qiita:Teamに投げた社内ドキュメントだったけど、特に問題ないのでQiitaにも投げる。 前提として browserify-rails とbabelify が導入されている状況を想定してる。 基本方針 新規コードはES2015で書く 本番はbrowserify(-rails)でコンパイルする。 単体テストは node 環境下で走らせる テスト環境下では jsdom で window, document をモックする 単体テストでは ブラウザ特有の挙動はテストしない 裏側の環境(browserifyやspec-helper)は難しくして良いが、利用者からみえる範囲は複雑にしない(npm install; npm testで走る) Universal JavaScript に寄せることでコードのポータビリティを上げる 事前準備 browserify-railsを導入する。 .babelr
Go言語でPerlのテストを早くする
Test::mysqld::Multiというモジュールを書いてみたみたいな涙ぐましい努力により5分で終わるようになったテストですが、 プロジェクトのコードも増えて人も増えた影響で、 テスト時間が約7分まで伸び、テストのキューに10個近く並んで順番待ちさせられるという状況になってしまいした。 この状況を解決すべく go-prove というものを書いてみたので、そのご紹介です。 proveが遅い理由 proveがテストの結果を読むところがブロッキングI/Oになっているらしく、そのせいで遅くなっているらしいです。 Perl-Toolchain-Gang/Test-Harness#30 実際に結果読んでいるところはこの辺ですかね。 selectとか使っていてなるべくブロッキングしないような作りにはなっていそうですが、どこかでブロッキングしてしまっているようです。 今のプロジェクトだと32コアのCP
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Testim.io - Simply Automate
Atomic Layout
GitHub - qustavo/httplab: The interactive web server
Airbnb Engineering & Data Science
GitHub - avajs/ava: Node.js test runner that lets you develop with confidence 🚀
STF | Smartphone Test Farm