エンジニアのはしがき

プログラミングの日々の知見を書き連ねているブログです

JavaScript

Jestの分かりにくい挙動たち

Jestはハマりやすかった 仕様まとめ モックを元実装に戻す方法 モックの実行タイミング jest.doMock()の注意点 jest.isolateModulesでモジュールへのモックの影響を閉じ込める 参考 Jestはハマりやすかった 数年Jestを書いていますが、Jestのモック周りで頭…

半Vibe CodingでChrome拡張を作ってみた 続

先日CursorでほぼVibe CodingでChrome拡張を作りました。 tm-progapp.hatenablog.com この拡張では右クリックメニューから拡張専用メニューを選択すると、任意のプロンプト+選択中のテキストをクリップボードにコピーしてAIサービスのプロンプト入力ページ…

半Vibe CodingでChrome拡張を作ってみた

先日Cursor Meetup Tokyoがありましたが、現地参加者349人、オンライン参加者5818人とかなり熱量を感じたイベントでしたね。(当日connpassのサーバが一時落ちたのも印象的でした) Cursor Meetup Tokyo - connpass 各セッションでのAI活用事例を聞きなが…

npm linkでローカルのnpmパッケージを参照できた

最近知ったnpm linkというものについて書いてみようと思います。 やりたかったこと とあるnpmパッケージの実装を変更した後、npm publish前にパッケージをimportしている別プロジェクト側から動作が確認したいというケースがありました。 具体的には、プロジ…

React + TypeScript + CSS ModulesでChrome拡張機能の開発環境を構築する

前回、webpack + TypeScriptの構成でChrome拡張の開発環境を構築しました。 tm-progapp.hatenablog.com ただ、DOMを拡張機能側で動的生成したりするよう場合、TSXで書きたいなァ…🤤という思いから構築してみました。

Chrome拡張の開発環境をWebpack+TypeScriptで構築する

このWebサイトのココをちょっと直したい…そんな思いからChrome拡張の開発を始めました。 ただやっぱりJavaScriptよりTypeScriptが書きたいと思い、環境を構築してみました。

WkWebView(Angular)からSwiftの処理を発火させる際に躓いたこと

やりたいこと SwiftでWkWebView(Angular)を動作させ、WebView側からSwiftの処理を発火させたい なおかつ普通のブラウザからでもAngularを動作させたい

iPadOSのWKWebViewでaudioの鳴り始めが途切れる謎現象について対策した

SwiftでWKWebViewを触って1年以上経ちましたが、普通のブラウザと違いiOS上でシミュレートされたブラウザ環境であるためか、メモリをよく食うらしく実装にはかなり気を遣います。 今回はそんなWKWebViewで音を鳴らそうとしたら割と手こずった話です。

JavaScriptでメモリの状態を取得できなかった

こんばんは! 今回は、Webアプリの謎のフリーズの原因を探るべくメモリの使用状況のログを取ろうといろいろと調べていたのですがJavaScriptだとなかなか辛かったという話です。

日付入力フォームはflatpickrがおすすめ

巷には様々な日付入力フォームのライブラリが溢れていますが その中でも先日導入したflatpickrが個人的に気持ちよく動いてくれたので紹介したいと思います!

クロスドメインにiframeを使うのは難しかった

iframeは実務でも趣味でも使う機会が全く無く、これに関しては無知だったのですが 先日Unity(WebGL)とiframeを組み合わせて自作ゲームを制作する機会があり、結果見事に頓挫したのでiframeについて調べた記録を残しておきたいと思います。 慣れた方にとって…

JavaScriptで使用ブラウザを判定させたい

Webアプリ開発ではブラウザの差異によって微妙な解釈違いがあり、フロントエンジニアの悩みの種になることが多々あると思います。 せめて使用ブラウザを判定して、推奨ブラウザへ誘導するような処理を実装したい… そういう思いでブラウザ判定処理について調…