Automatically detect memory leaks with Puppeteer - Article by Christoph Guttandin - Media Codings
About half a year ago Bronley Plumb kindly made me aware of a memory leak in one of my open-source packages. To see this memory leak in action it was necessary to open a browser and its dev tools to execute some manual steps. On top of that, the memory had to be inspected manually. It was a complicated procedure. Normally I just add a failing test before I fix a bug. This time it was a bit more tr
Published: 07 August 2019 at 21:00 UTC Updated: 07 September 2022 at 09:06 UTC AbstractHTTP requests are traditionally viewed as isolated, standalone entities. In this paper, I'll explore forgotten techniques for remote, unauthenticated attackers to smash through this isolation and splice their requests into others, through which I was able to play puppeteer with the web infrastructure of numerous
Storybook is the industry-standard tool for building component-driven user interfaces. It enables you to capture component use cases as stories and render them in a browser. During development, you can quickly cycle through them to verify UI appearance. But there's more to a component than just looks. Teams at Target, Adobe, and Shopify import stories in their tests to verify component behavior. N
JSer.info #609 - Next.js 12.3がリリースされました。 Blog - Next.js 12.3 | Next.js TypeScriptの自動インストールに対応、.envなどの変更にFast Refreshが対応、next/future/imageコンポーネントの改善が含まれています。 また実験的なオプションとしてunoptimizedの追加され、SWCでコードを圧縮するswcMinifyがStableとなりました。 npm v9.0.0-pre.0リリースされています。 Release v9.0.0-pre.0 · npm/cli Node.js 12のサポート終了されています。 workspacesでsemverのrangeを指定できるように、npm birthdayコマンド、npm binコマンドの削除されています。 また、npm pkgコマンドがあるため、
週刊Railsウォッチ（20190723-2/2後編）Rails 6 rc2がリリース、「MySQLパフォーマンスチューニングTips」が超便利、Aurora Serverlessほか｜TechRacho by BPS株式会社
2019.07.23 週刊Railsウォッチ（20190723-2/2後編）Rails 6 rc2がリリース、「MySQLパフォーマンスチューニングTips」が超便利、Aurora Serverlessほか こんにちは、hachi8833です。ジェネレーションの近さを実感しました。 なぜゼロワンなのに、左右非対称とか、赤青とかの属性がないのか(年寄りの発言) — Yukihiro Matsumoto (@yukihiro_matz) July 17, 2019 つっつきボイス:「これって何の話だっけ？😅」「あ、私が子どもの頃やってた某特撮番組です👶」「なるほど、令和ライダーの話ね😆」 各記事冒頭には⚓でパーマリンクを置いてあります: 社内やTwitterでの議論などにどうぞ 「つっつきボイス」はRailsウォッチ公開前ドラフトを（鍋のように）社内有志でつっついたときの会話の再構成です
What's New in DevTools (Chrome 117) | Blog | Chrome for Developers
Network panel improvements Override web content locally even faster The local overrides feature is now streamlined, so you can easily mock response headers and web content of remote resources from the Network panel without access to them. To override web content, open the Network panel, right-click a request, and select Override content. If you have local overrides set up but disabled, DevTools en
週刊Railsウォッチ（20190826）6-0-stableの更新を見てみる、『Morning Cup of Coding』ニュースレター、Rails TutorialがRails 6対応に動き出すほか｜TechRacho by BPS株式会社
2019.08.26 週刊Railsウォッチ（20190826）6-0-stableの更新を見てみる、『Morning Cup of Coding』ニュースレター、Rails TutorialがRails 6対応に動き出すほか こんにちは、hachi8833です。数列の1, 2, 4, 8,...みたいな表記を見ると、1, 2, 4, 8, 1, 2, 4, 8, 1, 2, 4, 8,...みたいな可能性もありそうな気がして不安になります。 つっつきボイス:「ruby-jp Slackのどこかで、Rubyの..だったか...を魔改造するみたいな話をちらっと見かけたんですけど、そっちの数学的表記の方が気になっちゃって😅」「どう解釈するか問題ね☺️」「数学方面だと無限数列の...の略記ってコンベンションが頼りというか割と自明でなかったりした覚えが😆」 各記事冒頭には⚓でパーマリンクを置い
2022年7月25日紙版発売 2022年7月22日電子版発売 手島拓也，吉田健人，高林佳稀 著 B5変形判／448ページ 定価3,498円（本体3,180円＋税10%） ISBN 978-4-297-12916-3 Gihyo Direct Amazon 楽天ブックス ヨドバシ.com 電子版 Gihyo Digital Publishing Amazon Kindle ブックライブ 楽天kobo honto 本書のサポートページサンプルファイルのダウンロードや正誤表など この本の概要 新しいフロントエンドの入門書決定版！ 本書はReact/Next.jsとTypeScriptを用いてWebアプリケーションを開発する入門書です。 WebアプリケーションフレームワークNext.jsはReactをベースに開発されています。高速さに裏付けされた高いUXと，開発しやすさを両立しているのが特徴です。
今年の1月に突如 microsoft/playwright が出て、「なに？puppeteerはオワコン？」と一瞬思いましたが、playwrightが出てからもpuppeteerはTypeScript化したりしていますし、いまのところどちらも活発に開発されています。 「puppeteerとplaywrightはどっち使えばいいの？」に対して、2020年12月現在の答えはおそらく「使いたいほうを使えばいい」です。 ただ、「使いたいほう」ってなんやねん？というところがググってもあまり情報が出てこないこともあり、今回の記事では、この選ぶ手がかりになる情報を少し投じておこうかなと思います。 PythonやC#でも使いたい？ puppeteerは現在のところJavaScriptのライブラリ一本です。 playwright はPythonとC#のバインディングがあります。 microsoft/play
開催期間: 2020.8.28 - 2020.9.10 Kindleストアの出版社横断プログラミング書籍セール 700冊以上が対象 50%ポイント還元 or 50%オフ (対象外のも含まれていますのでご注意を) 出版社別対象作品リスト: インプレス / 日経PB / SBクリエイティブ / マイナビ出版 / 秀和システム / 翔泳社 / 近代科学社 / MdN / NextPublishing (セール対象外多め) 本ページはキンセリの特設ページです アマゾンに当セールの対象作品一覧ページが存在しないので作成しました （間違い等ありましたら運営者までお知らせくだされば幸いです） 沈黙のWebライティング —Webマーケッター ボーンの激闘— 沈黙のWebマーケティング −Webマーケッター ボーンの逆襲− ディレクターズ・エディション アルゴリズムイントロダクション 第3版 総合版：世界標
Hajime Morita さんをゲストに迎えて、ポッドキャスト、雑談ブログ、ノートテイキングなどについて話しました。 Show Notes Zencastr Cleanfeed Misreading Chat – CS の論文読んで話をしよう Message Passing - はなしをふったりふられたり When Should I Write an Architecture Decision Record : Spotify Engineering Working Backwards Death by PowerPoint: the slide that killed seven people a16z Podcast: Amazon Narratives - Memos, Working Backwards from Release, More Audiblogs Audm ONYX
まえおき Railsでsystem specを導入するぞ！ というときに、Google検索をすると こういう記事が引っかかるかと思います。 単に「Cuprite使えばいいよ！」ではなく、そもそものシステムテストの必要性や開発経緯なども親切に書かれており、非常に素晴らしい記事です。 ただ、結果的にCupriteを称賛した内容で終わっており、人によっては「Seleniumなんか使わずにCuprite使えばいいんだ！」って思う人もいるかも知れません。 個人的にPlaywrightベースのCapybaraドライバを開発していて、その開発の際にCapybaraのソースとかCupriteの動作とか結構見たので、知見の共有をしておこうかなと思います。 SeleniumベースのCapybaraドライバ がスタンダード。それでも、Yet Another Capybaraドライバを求める理由はなんだっけ？ そ
CSS段組と印刷の地雷
column-count: 3 等を使ったCSSでの段組をして、印刷物をデザインする際にハマったことを共有します（ある程度段組CSSと印刷用CSSを知っている方を対象に書いています）。 バックグラウンド 行程さん 「行程さん」という、旅のしおりをウェブ上で簡単に作るサービスを作っています。今回はそのしおりをアナログ回帰させて、簡単に印刷してもらうために印刷専用のプレビュー画面をウェブ上で作ろうとしたのが始まりです。 機能 二つ折り用と三つ折り用 印刷されるものと同じ 考慮すること 特定の誰か、というものをあまり考えず、なるべくすべての環境で印刷可能にしたいと考えました。 日本、日本人 年齢 10代〜60代くらい ネットリテラシー ある ない 通信速度 遅い 速い OS、端末 Windows macOS Android iOS 印刷するプリンター 所持 コンビニ 対応ブラウザの決定打になった
技術ブログの数値集計の取り組み
この記事は GMOアドマーケティング Advent Calendar 2021 10日目の記事です。 はじめに こんにちは。 GMOアドマーケティングのKONCEです。 最近、弊社で運用している技術ブログの数値集計システムの一部を改修したので本ブログの執筆に至りました。 弊社技術ブログ「https://techblog.gmo-ap.jp/」は「所属エンジニアのアウトプットの場」と「ブランディングの向上」がメインの役割です。その上で取り組んでいる数値集計やその傾向などについて今回は触れていきたいと思います。 Google Analytics 集計数値について 流入調査などにメインで Google Analytics を使用しています。 PV、UUをメインに Google スプレッドシート と併用して数値を集計しています。スプレッドシートのアドオンから月別数値や記事別数値を取得し必要に応じて
Core Web Vitals とはlink 最近のフロントエンド周辺では Google が提唱した Web Vitals と呼ばれる指標が非常に注目されています。 これは Web で多くのユーザーが快適なユーザー体験を得るために、こういったポイントに特に気を使いましょう、というものを数値化したものです。 この中でも特に重要と定められている “LCP (Largest Contentful Paint)”, “FID (First Input Delay)”, “CLS (Cumulative Layout Shift)” の 3 つは Core Web Vitals と呼ばれています。 それぞれの観点を簡単に説明すると次のようになります。 LCP: 重要な要素がどれだけ早く読み込まれたか FID: 最初の入力ができるまでにどれくらいかかったか CLS: がくっとレイアウトが変わることがな
JSer.info #450 - Vue.jsをつかったフレームワークであるNuxt.js 2.9.0がリリースされました。 Release v2.9.0 · nuxt/nuxt.js v2.5.0で本体に統合されたTypeScriptサポートがリファクタリングされ、TypeScript関係の処理がコアからパッケージとして分離されています。 この変更により一部パッケージの入れ替えが必要になっているため、2.8からのマイグレーション方法については次のページに書かれています。 Nuxt TypeScript Migration from Nuxt 2.8 | Nuxt TypeScript Dateを扱うライブラリであるdate-fns 2.0がリリースされました。 Release v2.0.0 · date-fns/date-fns 破壊的な変更として、それぞれの関数が直接日付文字列を扱うの
Extract critical CSS Stay organized with collections Save and categorize content based on your preferences. The browser must download and parse CSS files before it can show the page, which makes CSS a render-blocking resource. If CSS files are big, or network conditions are poor, requests for CSS files can significantly increase the time it takes for a web page to render. Inlining extracted styles
PlaywrightとmswでスマートなE2Eテストを実現 - MONEX ENGINEER BLOG │マネックス エンジニアブログ
こんにちは。システム開発一部の吉田です。 最近初めてパーマをかけてみたら元々の天パと掛け合わさって髪がモジャモジャになりました。気に入ってはいますけど取れるのがいつになるのか心配です。 絶賛開発中のフロントエンド領域でPlaywrightとmswを用いたE2Eテスト(End to End Test)の導入をしました。これらのツールの導入に至った経緯と簡単な使い方をご紹介します。 以前書いたモックサーバーの記事の内容も含んでいるので、ご覧になっていない方は以下を参照してみてください。 blog.tech-monex.com E2Eテストのスコープ E2Eテストの概要はCircleCIの記事を見るとなんとなくわかった気になれます。 circleci.com 一言で言うと、E2Eテストとはユーザーが実際に操作する状況をシミュレートし、アプリケーション全体の動作を検証するテスト手法のことです。 ア
結論: Gyazo API のアップロードは Content-Type が不要だがなぜか fileName については暗黙的に要求する 以前の記事でも話した通り、私はパーマネントな画像をすぐに展開できるストレージとして日常的に Gyazo を使っています。 日常的なスクリーンショットでは Gyazo の Desktop App で事足りていたのですが、ちょっと個人的な用事で Bot に画像を添付したいモチベーションが出てきて。 Bot 自体はステートレスに管理したく、また投稿先も Slack なのか何なのかまだ決めていないのもあって、とりあえず Node.js から Gyazo API を叩いてアップロードすることにしました。 ただ5分くらいで終わるかと思ったら、なんやかんや 20 分くらいかかってしまったのでハマりメモとして残しておきます。 Gyazo API について Gyazo には
JSer.info #604 - Chrome 105 Betaがリリースされました。 Chromium Blog: Chrome 105 Beta: Custom Highlighting, Fetch Upload Streaming, and More Chrome 105 betaでは、Custom Highlight APIの実装、Container Queryの実装、:has擬似クラスの実装、Fetch Upload Streamingの実装などが追加されています。 また、navigator.mediaDevices.getDisplayMediaにsystemAudioオプションの追加、HTML Sanitizer APIの追加、import.meta.resolve()メソッドの追加、Response.json()メソッドの追加なども行われています。 非推奨だったWebSQ
What's New In DevTools (Chrome 81) | Blog | Chrome for Developers
Moto G4 support in Device Mode After enabling the Device Toolbar you can now simulate the dimensions of a Moto G4 viewport from the Device list. Click Show Device Frame to show the Moto G4 hardware around the viewport. Related features: Open the Command Menu and run the Capture screenshot command to take a screenshot of the viewport that includes the Moto G4 hardware (after enabling Show Device Fr
週刊Railsウォッチ（20190806-2/2後編）RSpec CopのLeakyConstantDeclaration、serveoでゼロコンフィグ公開、RuboCopのPerformance/RegexpMatch改修ほか｜TechRacho by BPS株式会社
2019.08.06 週刊Railsウォッチ（20190806-2/2後編）RSpec CopのLeakyConstantDeclaration、serveoでゼロコンフィグ公開、RuboCopのPerformance/RegexpMatch改修ほか こんにちは、hachi8833です。来週の週刊Railsウォッチはお盆休みのためお休みをいただきます🙇。先祖の供養を忘れずに。 各記事冒頭には⚓でパーマリンクを置いてあります: 社内やTwitterでの議論などにどうぞ 「つっつきボイス」はRailsウォッチ公開前ドラフトを（鍋のように）社内有志でつっついたときの会話の再構成です👄 毎月第一木曜日に「公開つっつき会」を開催しています: お気軽にご応募ください 今回は「公開つっつき会」第13回を元にしています。ご参加いただいた皆さま、ありがとうございます！ ⚓Ruby ⚓awesome-ru
GARMINのBody Batteryを計測できる時計が身の回りで流行っていて、Slackに「いまbody battery70です」とか書いて元気さをアピールしたり、Body Batteryめっちゃ下がってるので難しいことをする気力はないという表明をしたりしていた。 わざわざ近況を手で書かなくても、Slackのstatusとして見えるようになってると便利そうと思ったので自動化するスクリプトを書いてみることにした。 既存手法と実装方針 GARMINはfitbitとちがって個人向けのAPIを用意してくれていない。同僚が申請してみたところビジネスプランを書けって弾かれたと話していた。そのため人々はさまざまな苦労の末にデータを取り出している。 Garmin connectのストレス測定結果をPixela + Serverlessで草化 - Qiita スクショをAWS S3にアップロードして画像解
作成したウェブサイトがちゃんと動作するのかを確かめたり、サイトを巡回してデータを集めたりなど、毎日のように実行するタスクはなんとか自動化したいもの。そんなブラウザ操作の自動化について、ウェブアプリやAPIの動作を監視してくれるツール「Checkly」を作成したチームが、専用サイト「theheadless.dev」にまとめています。 theheadless.dev - Learn Puppeteer & Playwright https://theheadless.dev/ サイトにアクセスし、「DIVE INTO IT」をクリックすると…… ブラウザ操作についての情報が、ブログ形式でまとめられています。記事作成時点では21個の記事が投稿されていました。 左側のメニューには基本的な記事へのリンクが用意されています。一番上は「What is Puppeteer?」で、Chromeを自動で操作す
テスト自動化を10年続けて分かったこと
テスト自動化を10年続けて分かったこと - 開発者が語るINTARFRMテストツール - Copyright 2019 FUJITSU LIMITED JaSST ’19 Tokyo 富士通株式会社 自己紹介 頭島 俊樹（かしらじま としき） 所属 富士通株式会社 サービステクノロジー本部 システムインテグレーション技術統括部 主な仕事 富士通製アプリケーションフレームワーク INTARFRM（インターファーム） の開発 Copyright 2019 FUJITSU LIMITED 1 システム開発のための 技術支援やツール開発 本日の内容 過去の取り組み紹介 現在の取り組み紹介 まとめ Copyright 2019 FUJITSU LIMITED 2 テスト自動化を始めた背景 テスト自動化を始めた背景 「設計」支援機能 特徴 - 専用の設計ツール - 設計情報の管理・分析 - 設計内容を
JSer.info #473 - npmにはパッケージを公開した人がパッケージを取り下げるルールを決めたnpm Unpublish Policyがあります。 今回、このnpm Unpublish Policyのルールが更新されています。 The npm Blog — Changes to npm Unpublish Policy - January 2020 元々このUnpublish Policyはleft-padがunpublishされた件で、使われているnpmパッケージがunpublishされるとnpmのエコシステムが壊れるため、npm unpublishに対して制限を入れるために導入されたルールです。 The npm Blog — changes to npm’s unpublish policy 今回の変更では、npm publishしてからnpm unpublishできるまでの
JSer.info #567 - TypeScript 4.5が正式リリースされました。 Announcing TypeScript 4.5 - TypeScript TypeScriptがビルトインで持つlibの型定義をpackage.jsonのdependenciesを使ってロックできるようになっています。 Awaited型の追加、Top-Level awaitに対応したmodule: es2022のサポート、Condition Typesにおいて一部末尾最適化するようになる変更も含まれています。 import名に対するtype modifierのサポート、ES ProposalのPrivate Field Presence Checks、Import Assertionsのサポートなども追加されています。 TypeScript 4.5 Betaで追加されていたNode.jsのESMサ
「ほたるんの服」の差分はどこにあるのか - 私が歌川です
小ネタです。 仕事してたら気づいた。ほたるんの服、完全にGitHubじゃん。 pic.twitter.com/z0m1UuyuAh— ズッキー (@zukky162) 2021年12月2日 2021/12/3時点での引用リツイートには、どのcommitのどの行かを示したツイートはなかったので、たぶんこれが一番速いと思います。 ほたるんの服のcommit発見した https://t.co/bPH6KcrjtH— うたがわきき (@utgwkk) 2021年12月3日 アタリをつける firefoxArguments などの変数名からブラウザを起動する何かであるということを推測します。devtools や headless などの引数名からこれはpuppeteerのcommitではないか、とアタリをつけました。ここで外すとタイムロスです。 当該の差分を探す GitHubのスクリーンショットから
Blog JavaScript Performance in the Wild 2020 We rendered a million web pages to find out what makes the web slow We rendered the top 1 million pages on the web, tracking every conceivable performance metric, logging every error, noting every requested URL. To our knowledge this produces the first dataset that connects performance, errors, and library use on the web. In this article we analyze what
はてなブログ独自の集計による人気記事のランキング。12月20日（日）から12月26日（土）〔2020年12月第4週〕のトップ30です*1。 # タイトル／著者とブックマーク 1 Pythonで仕事をする人のための書籍まとめ2021 - 学習, 業務効率化, アプリ開発からデータサイエンスまで - Lean Baseball by id:shinyorke 2 ドメイン駆動設計を浸透させるために転職して最初の3ヶ月でやったこと（DDD）- little hands' lab by id:little_hands 3 30代東京の子育て世帯は年収650万円必要という労働組合調査が妙に納得感高い - 銀行員のための教科書 by id:naoto0211 4 「技術のスペシャリスト」になれないエンジニアのキャリアを考える - paiza開発日誌 by id:paiza 5 本物のサイバーパンク体験
What's New In DevTools (Chrome 92) | Blog | Chrome for Developers
CSS grid editor A highly requested feature. You can now preview and author CSS Grid with the new CSS Grid editor! When an HTML element on your page has display: grid or display: inline-grid applied to it, you can see an icon appear next to it in the Styles pane. Click the icon to toggle the CSS grid editor. Here you can preview the potential changes with the on screen icons (e.g. justify-content:
JSer.info #619 - 毎年行われているJavaScript開発者向けのアンケートである State of JavaScript 2022 が開催されています。 State of JavaScript 2022 言語機能やフレームワークなどについてのアンケートをとっていて、2022年12月15日まで受付けています。 過去の結果については次のページで公開されています。 The State of JS 2021 State of JS 2020 ECMAScript proposal: RegExp flag /v makes character classes and character class escapes more powerfulという記事では、現在ECMAScript Proposal Stage 3のRegExp v flagについて解説されています。 正規表現のv
（たんなるポエムです） 個人的に、 puppeteer-ruby と playwright-ruby-client という２つのOSSを育てている。 puppeteer-rubyは Google Chromeチームによる元祖Puppeteer をまるっとRubyで再実装したライブラリで、playwright-ruby-clientは PuppeteerからフォークしてMicrosoft（のなかの元Chromeチームメンバー）が育てているPlaywright のクライアントAPIをRubyで実装したライブラリだ。 実装において、puppeteerやplaywrightのソースコードをそれなりに読んでいる。 Playwrightの唯一の欠点(= Puppeteerの存在意義)がなくなった 個人ブログでこの記事を書いたときには、Playwrightは自身が起動したブラウザしか自動操作できないとい
skruv No-dependency, no-build, small JS view-library/framework-ish-thing. Features • Examples • Docs Github • NPM Features No dependencies Small: Smallest framework in krausest benchmarks ~200 LOC ~1kb minified and compressed (1140b with brotli, 1310b with gzip, 2809b uncompressed) Usable without bundling/compilation/transpilation Supports HTML, SVG, MathML, Atom feeds and sitemaps. Types to valid
株式会社ラクスが開催するエンジニア向けのイベント「RAKUS Meetup」。今回は「Vue.js、React、TypeScript、E2Eテスト」をテーマに、Chat Dealerの開発と運用を担当する川又由雅氏が登壇し、「テスト稼働の削減とフロントエンドの品質担保を行うE2Eテスト」という内容で話をしました。関連資料はこちら。 Chat Dealerの開発と運用 川又由雅氏（以下、川又）：それでは「テスト稼働の削減とフロントエンドの品質担保を行うE2Eテスト」について発表いたします。よろしくお願いします。 まず私の簡単な自己紹介からしたいと思います。私は川又由雅と申します。2018年に新卒入社でラクスに入社しました。今年で3年目になります。現在はChat Dealerの開発と運用に携わっていまして、バックエンドとフロントエンドを取り扱っています。今年は学習が趣味で、Vue.jsを用いて
はじめに 「Nuxt on Dockerにて、Jest + Puppeteer でE2Eテスト環境をセットアップする」でJest + PuppeteerでE2Eテストをする環境を整えました。 この記事では、実際にE2Eテストを記述するときに使う操作や検証のコードをまとめておきます。 自分が使ったコードを書いていくので、順次増えていく予定。 基本 テストファイル内の基本構文は以下のとおりです。 describe('テストスイート名', () => { test('テストケース名', async () => { await page.goto('http://localhost:3000') // 操作とか await expect(page.url()).toBe('http://localhost:3000') // 検証とか }) }) describeとtest 1つのファイルには1つ
Web Development 2018 Q4 Graph JavaScriptとWebエコシステムがどれほど成長したかを考えると、1つのグラフにすべての領域を表示することはもはや現実的ではありません。その結果、分析を11の主要分野に分割しました。 Web開発 言語 / 標準 / パターン Web開発 クライアントサイドフレームワーク / ライブラリ Webエンジニアのためのサーバサイドプラットフォーム / フレームワーク / データ / API Webエンジニアのためのクラウド パッケージ管理 / バンドル / 最適化 Web開発のテストと自動化 Webエンジニアのためのモバイル / デスクトップ環境とフレームワーク WebエンジニアのためのIoT / ブロックチェーン / 機械学習 WebエンジニアのためのVisualization / XR CSS Web開発 コードエディタとIDE
TL;DR Playwrightは導入コストが高くはない ひとまずスクリーンショットを全ページ撮るだけでも、QAの工数（もしくは自分の確認する時間）を削減できた 意外とやってみると書ける playwright-cliのコード自動生成が非常に便利！ きっかけ プロジェクトでPlaywrightのフロントエンドのE2Eテストを書かせていただく機会がありました。 導入〜テストケース作成〜実装までやらせていただいて、知見がある程度溜まったので まとめてみることにしました。 至らぬ点もあるかと思いますが、その際はご指摘いただけますと幸いです。 ざっくりブラウザテストのこれまで 参考：https://blog.logrocket.com/playwright-vs-puppeteer/ Selenium ブラウザテストの自動化自体は新しい技術ではなく、2004年ごろからSeleniumがあった しかし
If you want to build AI products that are unique, valuable, and fast, don't do what everybody else is doing. I'll show you what to do instead. What not to doThe vast majority of AI products being built right now are just wrappers over other models, such as those that essentially involve calling ChatGPT over an API. While that's incredibly easy — you send natural language in and get natural languag
ChromeのSpeechRecognitionで使って、音声ファイルの自動文字起こしをするアプリを書いた SpeechRecognition APIを使って、wavやmp3などの音声ファイルを再生しながら文字起こしをするウェブアプリを書きました。音声ファイルをざっくりと文字に起こして、内容をざっくりと把握して聞きたい位置にジャンプする目的で作りました。 「Chromeの」としているのは、現時点(2020-12-31)ではSpeechRecognitionを実装しているのがChrome系のブラウザのみだからです。 SpeechRecognition APIを使って音声ファイルの文字起こしをするアプリを書いた。https://t.co/GSI1gOvLVE *Chrome + BlackHoleが必要 かなり無理矢理な方法でInputとOutputにBlackholeを設定して、loopba
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTTP Desync Attacks: Request Smuggling Reborn
Interaction Testing with Storybook
2022-09-13のJS: Next.js 12.3、npm 9 preリリース、Safari 16
TypeScriptとReact/Next.jsでつくる 実践Webアプリケーション開発
2020年12月現在、puppeteerとplaywright どっち選んだらいいの？ - Qiita
【Kindle】夏のプログラミング書 合同フェア (2020/8/28から9/10まで)
Rebuild: 300: Note-Taking Nirvana (omo)
2021年6月現在、Cupriteで"正しい"システムテストはできるのか？
Lighthouse CIでサイトのスコアを定期的にチェックしよう
2019-08-27のJS: Nuxt.js 2.9.0(TypeScript)、ChromiumベースのMSEdge βリリース、data-fns 2.0.0
Extract critical CSS | Articles | web.dev
Gyazo API を Node.js の Buffer から直に使おうとしたらハマった話
2022-08-09のJS: Chrome 105 Beta、npm v8.16.0(npm query)、Import Maps
GARMINのBody BatteryをSlack statusに設定する - hitode909の日記
ブラウザのさまざまな操作を自動化するためのガイドをまとめたサイト「theheadless.dev」
2020-02-05のJS: npm unpublish policy、yarn v2(berry) RCリリース
2021-11-23のJS: TypeScript 4.5、React 18 beta、Remix v1
JavaScript Performance in the Wild 2020 | CatchJS
今週のはてなブログランキング〔2020年12月第4週〕 - 週刊はてなブログ
2022-11-22のJS: State of JavaScript 2022のアンケートを実施中、RegExp `v` flag
2021年現在、Puppeteerを使う理由はなくなった。Playwrightを使おう。
skruv
品質を保ちながら190時間以上あったテスト稼働を削減 フロントエンドでE2Eテストを導入して得られたもの
Jest + PuppeteerのE2Eテストで使うコード集
JavaScriptとWeb開発 InfoQ トレンドレポート 2020
PlaywrightでフロントエンドのE2Eテストを自動化してみた話
Don’t Build AI Products The Way Everyone Else Is Doing It
ChromeのSpeechRecognitionで使って、音声ファイルの自動文字起こしをするアプリを書いた