2022-01-01から1ヶ月間の記事一覧
Jestでthrowされたエラーをテストしたく調べたのでメモ jestjs.io これがドキュメントにあった使い方 rejectされたpromiseの理由を取り出すには .rejectsを使用する // .rejectsを使う it('tests error with rejects', () => { expect.assertions(1); return…
Remixの開発者が書いたRemixとNext.jsの違いについてのブログを読んだ remix.run 比較対象がNext.jsのSSGとの比較なのでSSRと比較したらまた違うんじゃ？という感想もあるが参考になった たとえば検索ページにおいてはNext.jsのSSGはそのほとんどが事前に生…
JestとMSWでReactコンポーネントのfetch部分をmock化しようとしたらエラーになった ReferenceError: fetch is not defined whatwgのfetchはブラウザでしか使えないのでJest（node）で使うにはpolyfillが必要 jest.config.js const fetchPolyfill = require('…
MSWを使っていて、以下のようにクエリパラメータによって結果が変わるテストをしたい /api/list?q=xxxx&a=yyyy&b=zzzz そこでMSWのルーティングマッチング機能があるので調べた mswjs.io まず、基本的にAPIリクエストのマッチはmethodとURLで行われる 方法は…
Reactコンポーネントのテストを何を使ってやるかの話で、これまでCypressを導入してテストをしてきたが実行時間が長いのでテストが増えてきて億劫になってきた 画面のキャプチャを保存する機能は重宝しているのでCypressを使い続けるにしても、Cypressの頻度…
Jestで外部APIとのAdapterのテストをしたい JestでMock化してもよいが、テスト以外でもそのモックを使用したいので以前調べたMSWを使うことにした uga-box.hatenablog.com ちょうどそんな時、以下の記事が公開されたので参考にさせてもらった zenn.dev zenn.…
去年2021年5月に障害者差別解消法が改正（令和３年法律第56号）された話を聞いた これにより行政機関等に加えて、事業者も障害のある人に対して「合理的配慮を提供すること」が義務付けられるとのこと 改正法は、公布の日（2021年6月4日）から起算して３年を…
スマホで入力フォームにフォーカスインするとスマホのキーボードが表示される このとき、入力して各キーボードの右下の決定ボタン（iOSならreturn、Androidなら矢印）をクリックしたときの制御をしたい 具体的には、この入力フォームがformタグの中にあり、…
デザイナーにいままで「ヒラギノ角ゴ」を使っていたのを「游ゴシック」にしたいと言われた この時のWebフロントエンド実装における問題点などを調べた そもそも游ゴシックとは？ 字游工房のサイトにあった 游ゴシック体ファミリーは、游明朝体と一緒に使うこ…
Rustにおけるswitch文の書き方を探していたらmatchを使うことがわかった doc.rust-jp.rs Java（< 14）やJavaScriptより表現力があるみたい 簡単な使い方は以下 enum Coin { Penny, Nickel, Dime, Quarter, } fn value_in_cents(coin: Coin) -> u32 { match c…
Rustで以下のようなenumが用意されていて pub enum ResistorColor { Black, Brown , Red , } 次のようなテストをパスするcolors()関数を作るという問題を解いているとき #[test] fn test_all_colors() { use ResistorColor::*; assert_eq!( colors(), vec
スマートフォンで入力フォームにフォーカスをあてるとソフトウェアキーボードが出現するが、position: fixedで画面の下部に固定した領域（フローティング領域）がiOSとAndroidで挙動が異なっていた 特に困ったのはAndroidの方で、キーボードが呼び出されると…
Rustで以下のようなenumが用意されていて pub enum ResistorColor { Black, Brown , Red , } 次のようなテストをパスするcolors()関数を作るという問題を解いているとき #[test] fn test_all_colors() { use ResistorColor::*; assert_eq!( colors(), vec
LocalStorageに格納できるmaxサイズを知らなかったので調査 一つのkeyに何バイトまで格納できるのかを下のHTMLをつかって確認した（headとかは省略） setIntervalで100KBずつ文字列を増やしていって、何バイトでエラーが発生するか <button onclick="start();">実行</button> <script> var storage = wind…
今年になってRustのお勉強を再開したら以下のようなエラーが出た error: failed to parse manifest at `/Users/uga/Exercism/rust/Cargo.toml` Caused by: feature `edition2021` is required どうやらRustのバージョンが古いので更新しろということらしい s…
faker.jsというランダムなユーザー情報を生成してくれるOSSが消されたと話題になり、そのすぐあとにcolors.jsというターミナルに出力するログに色付けるOSSに悪意のある変更が仕込まれたというので話題になった どちらもMarakという方が開発したもので、それ…
JavaScriptで作ったアプリでのエラーをハンドリングしたい 例えば、Node.jsのAPIサーバーでリクエストパラメータの精査エラーをハンドリングするなど 特定のエラーを処理する場合はMDNにあるようにinstanceofで判別することができる try { foo.bar() } catch…
Reactアプリケーション内でSVGアイコンを以下のようによびだしている <svg> <use href="/public/sprite.svg#icon-star" /> </svg> ただ、このままだとStorybookで表示できないことに気づいたので対処方法を調べた Storybookのpublicなassetsを表示する方法は以下にあった storybook.js.org // .storybook/main.js mo…
Yahoo!ニュースの取り組み事例でブラウザバックの最適化の話が記事になっていた t.co この中で、キャッシュした記事リストをリロード時に破棄するため、performance.getEntriesByType()を使ってリロード判定する方法が紹介されていたが、performance.getEntr…
