AI-powered Quality Engineering PlatformAIと品質保証のプロが テスト自動化・効率化で 開発の生産性を向上

2021/09/13 Open8 で発表したフロントエンドテストプラクティスの話です。
CodeceptJS is opensource MIT licensed testing framework. Works with your favorite frontend frameworks → Scenario Driven Write acceptance tests from user's perspective. Make tests readable and easy to follow. Driver Agnostic Run your tests via Playwright, WebDriver, Puppeteer, TestCafe, Protractor, Appium. The code is the same. Learn More
ウェブサイトのテスト自動化やスクレイピングに利用されるPuppeteerやPlaywrightといったライブラリを使うと、ChromeやFirefoxなどのGUIを備えるブラウザなしにウェブサイトの情報を取得することができます。そんなPuppeteerやPlaywrightのコードを「ブラウザの操作」から逆に取得できるのが、Chrome拡張機能の「Headless Recorder」です。 Headless Recorder - Chrome ウェブストア https://chrome.google.com/webstore/detail/headless-recorder/djeegiggegleadkkbgopoonhjimgehda Headless RecorderはChromeウェブストアで配信されているので、上記のURLにChromeでアクセスして「Chromeに追加」をクリッ
こんにちは。 一休.comの開発基盤を担当しています、akasakasです。 今回は、E2EテストをSelenium WebdriverからCypress.ioに移行した話をしたいと思います。 一休のE2Eテスト事情 あれから、数年が経過して、、、 どうしてこうなった??? SeleniumではSPAへの対応が難しくなってきた なんでもかんでもSeleniumで頑張ろうとした弊害 いざリプレイスへ・リプレイスをする上で気をつけたこと 開発者フレンドリー 安定性 然るべきレイヤーでテストする(何でもかんでもブラウザテストにしない) 技術選定 Cypress.io とは? Cypress.io のいいところ セットアップが楽 テストを書くことだけに集中できる CI連携が楽 Cypress.io の頑張って欲しいところ その他、移行に関しての細かい話 重複テストケースの排除 Page Objec
(Updated on: 21.11.2021) This guide is intended to catch you up with the most important reasoning, terms, tools, and approaches to JavaScript testing for the year 2022. It combines information from the best articles recently released (they are referenced at the bottom) and adds from my own experience. It’s a little long but whoever reads and understands this guide, can safely assume they know the
はじめに E2EテストとはEnd to End(エンドツーエンド)の略らしいです。最初から最後までということのようです。 ブラウザを使ったテストの自動化のために今回はProtractorを使うことにしました。 ちょうど仕事で担当になった運用サイトがAngular製アプリケーションだったこともあります。 ProtractorはAngular製のサイトに向いているとのことです。ただAngular製ではないサイトでも利用可能です。 Protractorはwebdriver-managerというものを使ってSeleniumを利用します。 準備するものはnodejsです。 前回書いた次の記事でnodejsを用意していただければ動作します。 windows10でnode.jsのバージョンを切り替えて使う( nvm-windows ) 今回はwindows10の環境で進めます。 Protractorの準
今回は技術Tipsではなく、個人的に試していて壁にぶち当たったのでアドバイスを 誰かから貰えればいいなと思い、記事にしています。 はじめに 環境 ・一般共有不可、SSOを挟んでログインする必要のあるG Suite ・Google ドライブのドライブFileStreamなどインストール不可 ・GASにて、doPost()で受け取ったデータをドライブに保存するウェブアプリ つまり、未ログインの状態から何をするにもログインが求められるという環境だ。 やっていること PCで生成したデータ(JSONなり、CSVなり)を上記G Suiteの環境のドライブにアップロードするべく、GAS製のウェブアプリへpostで通信。 また、これを自動化。 経緯 元々はPhantomJSを使って上記を実現していたのだが、Chromeが正式にヘッドレスモードを実装したこと、それにともないPhantomJSが開発終了したこ
はじめに JavaScriptによってコンテンツが生成されるサイトは、よく使用されるBeautifulSoup4だけではスクレイピングできません。 例えば「最後までスクロールすると次のコンテンツが表示される」といったサイトです。 URLが変化するわけでもないし、どうすればいいのでしょうか…。 そんなときに登場するのがSelenium+PhantomJSです。 背景 さまざまなケースでWebスクレイピングができるようになりたいという想いのもと、今回も『Pythonクローリング&スクレイピング』という本を参考に実践していきます。 単純に、Webスクレイピングは楽しいです。 やること 「note」というサイトのスクレイピングを行います。 トップページに表示される投稿の タイトル URL 概要 を抽出し、MongoDBやcsv、RSSで保存します。 何ができるのか 以下のようなページからスクレイピ
自分で作っているプロダクトで、一部他のサイトからスクレイピングをする必要があったものの、JSで動的に生成されている要素だったため、スクレイピングができませんでした。 そのため調べてヘッドレスブラウザを使うことにしたのですが、いろいろあってスクレイピングする必要がなくなり、調べた時間を無駄にしたくないと思いまとめました。。 ヘッドレスブラウザとは 調べてみるとGUIのないブラウザと説明をよく見ます。 ヘッドレス Chrome ことはじめによると下記のような説明がありました。 ヘッドレスブラウザは、GUI を持つ必要のない自動テスト環境やサーバー環境にとてもよいツールです。例としては、実際のウェブページに対してなにかテストを実行する、そのページの PDF を生成する、またはただ、そのページがどう表示されるかを検証するなどが挙げられるでしょうか。 GUIはないけどブラウザが行ってくれている処理を
HTMLの情報を取得したいけど、欲しい情報はjavascript等でレンダリング後の情報というのはよくある話です。 毎回手動で取ってくるのは面倒、そういう時に便利なのがPhantomJSです。 つい最近自分も使ってみたので、誰かの参考になればと思いメモとして残します。 動作環境 Amazon Linux AMI release 2018.03 composer 1.5.1 PhantomJSインストール $ cd /usr/local/src $ sudo wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-linux-x86_64.tar.bz2 $ sudo tar jxfv phantomjs-2.1.1-linux-x86_64.tar.bz2 $ sudo ln -s /usr/local/sr
Intro 特別なドメインとして予約され、特定の用途で使用可能なドメインとして、.example .localhost .test などがある。 localhost の Draft や、gTLD である .dev が Chrome で Preload HSTS になったなどの動きを踏まえ、これらの意味や用途を解説する。 ドメインを利用する上での注意 ドメインは、レジストラなどを通じて取得するため、インターネット上では好き勝手に取得することはできない。 しかし、自分で設定可能な DNS や hosts ファイルなどを使えば、任意のドメインを任意のアドレスに解決させることができる。 例えば、自分が適当にリクエストのテストを行うためのドメインを hosts ファイルに設定し、ループバックアドレスに解決して流していたとする。 このドメインがたまたま実在するものだった場合、そのテストを他のユーザが実
経緯 JSによるレンダリング後のhtmlをスクレイピングしたかったので、phantomjsを使用。 他のページはそういう感じではなく、phpQueryでスクレイピングしていた。 そのためこういう事になりました。 方法 理由はよくわからんが、いい感じになってくれないので、 DOMDocumentにしてからphpQueryに食わせないといけなかった。 //phantomjsでhtmlをとってきて $client = Client::getInstance(); $client->getEngine()->setPath(PHANTOMJS_PATH); $request = $client->getMessageFactory()->createRequest(); $response = $client->getMessageFactory()->createResponse(); $req
はじめに この記事には真新しい内容はありません、スクレイピングを手軽に、言語に縛られないように僕がPhantomJSをどう利用しているかの備忘録的な位置づけになります。 やりたい事 スクレイピングに集中したい スクレイピングでやりたい事はDOMの収集です、必要ならばJavaScriptの処理実行後に収集します、動的なぺージ遷移、POSTによるページ遷移も行います、これらの煩わしい処理はPhantomJSに任せ、スクレイピング以外のコードをなるべく書かないように済ませられるようにします。 どの言語でも扱えるように汎用化しておきたい 各種言語で各種ライブラリが日進月歩で登場しています、必要だと思われたから登場したのでしょうが言語を変える度に最新のライブラリを追って組み込むのは大変です。 JavaScriptでスクレイピングし、結果をJSONで返す部分を切り出せば、各種言語はその処理を呼び出し、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く