モバイルWebのトピックで空白画面：管理コンソールでTypeErrorが発生

[thedavidprice (David Price)]

iOS vs13.3.1
Mobile Chrome v80.0.3987.95

フォーラムのトピックにアクセスしたところ、ヘッダーのみが読み込まれました（1 件の場合は 2 回、エラー出力以下のスクリーンショットを参照）—実質的に空白のページでした。その際、私はログアウトしていました。リフレッシュ、新しいページでの再読み込み、アプリの終了と再読み込みを行っても問題は解決しませんでした。モバイルからは診断が非常に困難です。

デスクトップではこの問題を再現できませんでした。

管理者のエラーログから、同じ時刻に発生した 2 つのエラーを関連付けることができました。

# 最初のエラー 20:09

TypeError: undefined is not a function (near '...l.replace...') Url: https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js Line: 1 Col

https://community.redwoodjs.com/assets/pretty-text-bundle-b028b1d5eed228f191f4f25757a12c99d1209f6a9ce91f98c6d378dd3589df7d.js:1:88120
https://community.redwoodjs.com/assets/application-c72a723208a0a310c886f34a1d7e6157d4a403f74e04829c4d23643ffea3593c.js:1:1218167
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:112413
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:419530
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:409113
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:422544
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:422239
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:415154
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:449567
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:449160
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:449067
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:474873
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:142193
V@https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:187610
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:145561
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:145879
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:145269
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:144382
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:144109
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:490070
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:489056
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:491075
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:496504
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:493039
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:497040
e@https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:29468
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:29788

# 2 番目のエラー 20:51

TypeError: undefined is not an object (evaluating 'e.position().top') Url: https://community.redwoodjs.com/assets/application-c72a723208a0a310c886f34a1d7e6157d4a403f74e04829c4d23643ffea3593c.js Line:

l@https://community.redwoodjs.com/assets/application-c72a723208a0a310c886f34a1d7e6157d4a403f74e04829c4d23643ffea3593c.js:1:208270
t@https://community.redwoodjs.com/assets/application-c72a723208a0a310c886f34a1d7e6157d4a403f74e04829c4d23643ffea3593c.js:1:208295
scrolled@https://community.redwoodjs.com/assets/application-c72a723208a0a310c886f34a1d7e6157d4a403f74e04829c4d23643ffea3593c.js:1:1095126
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:490059
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:489056
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:491075
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:496504
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:493039
https://community.redwoodjs.com/assets/ember_jquery-3ed0ac532033dfeecf1ec0676df6716cd7076530930c656754ccf103d35b3e23.js:1:497862
[native code]

追加の情報や評価を支援するための手順についてご提供いただける場合は、お知らせください。

[Stephen]

他のサイトでも再現手順が見つかるまで、一時的に Support に移動させます。ここで、あるいは try.discourse.org で再現可能な場合、それは bug として扱われます。あなたのサイトにある該当トピックをモバイルから閲覧してみましたが、空白ページの問題は全く再現できませんでした。

まず確認すべきことは、セーフモードでも動作するかということです：RedwoodJS Community

もし動作する場合は、おそらくサイトのカスタマイズが原因です。ただし、それが本当であれば、私も同様の現象を目にするはずだったと思います。

[thedavidprice (David Price)]

@Stephen ありがとうございます。セーフモード内およびセーフモード外で両方のエラーを再現しようと試みましたが、残念ながらできませんでした。ユーザーがログアウトしている場合にのみ発生するのではないかと疑っています。おそらく、私がログインした際にキャッシュなどがリセットされ、その結果としてエラーが「修正」されたのでしょう。

付け加えるのを忘れていましたが、最初にエラーが発生した手順は以下の通りです：

1. Slack アプリでは Discourse 連携を使用しています。連携ボットからトピックリンクをクリックすると、モバイルの Chrome ブラウザで開かれます。
2. Chrome ブラウザではログインしていませんでした。上記の空白ページが表示されました。

私のスマートフォンには Discourse Hub アプリがあります。通常は、このアプリを直接開いてフォーラムやトピックにアクセスしています。

[thedavidprice (David Price)]

ゲストとしてサイトを利用しているユーザーから、さまざまなトピックでこの問題に関する報告が増えています。私が関連すると思われる管理者のエラーログは、pretty-text-bundle または ember_jquery アセットに関する TypeError: X is not a function のバリエーションです（元の投稿のエラーと同じです）。

→ 直ちに 2.5.0.beta3 にアップグレードしました。これで問題が解決するかどうか、後ほど報告します。

再現手順

Safe Mode を使用してこのエラーを再現することはできませんでした。Safe Mode を有効にするとエラーは発生しなくなりますが、Safe Mode を無効にしても、再度エラーを再現することはできませんでした。

このトピックでは、Web ブラウザでのゲストアクセスを通じて、しばらくの間エラーが再現していました:
RWJS v0.6.0 が利用可能になりました

あるユーザーは、https://community.redwoodjs.com/logs/report_js_error から出力された結果を報告しており、そこには以下が表示されていました:
Rate Limited

Mac の Safari でゲストとしてアクセスすると、このエラーと対応する Rate Limited を再現できました。しかし、同じトピックは Firefox（これもゲストとして）では正常に読み込まれました。

サイト設定/ホスティング

当サイトでは、以下の 2 つのプラグインを使用しています:

• discourse-chat-integration
• docker_manager

ホスティングは Digitalocean で、提供されているインストール手順に非常に近い構成で設定されています。

[codinghorror (Jeff Atwood)]

セーフモードで問題が解消するなら、おそらくテーマに原因があるでしょう？

[thedavidprice (David Price)]

可能です。ただ、かなり標準的な内容ですが……

引き続き試してみます。再現例があるかと思うと、毎回問題が解消されてしまいます。

もしかしてキャッシュの問題でしょうか？確認方法はありますか？

[codinghorror (Jeff Atwood)]

ここで再現できないなら、それはあなたの環境設定に何らかの原因があります。

[thedavidprice (David Price)]

承知いたしました。実は、3月に当サイトをセットアップした際、meta.discourse.org で同じ現象を経験しました。Slack 統合の設定について Google で検索し、トピックへのリンクをクリックしたところ、タイトルヘッダーが複数回繰り返されたほぼ空白の画面が表示されてしまいました（元の投稿の 2 枚目のスクリーンショットをご参照ください）。その時は Google 検索のキャッシュ版で回避し、それ以降は同じ現象には遭遇していません。他のトピックやホームページには問題なくアクセスできました。

不思議ですね。

引き続き調査を進め、必ず結果をお知らせします。運が良ければ、beta3 アップデートで何らかの形で解決しているかもしれません。

最後に、Discourse には大変満足しており、わずか 6 週間でコミュニティが急速に形になってきたことに感銘を受けています。いつか RedwoodJS についても、成長する時間を与えられれば、人々が同じように言ってくれる日が来ることを夢見ています。

ありがとうございました。

[codinghorror (Jeff Atwood)]

プロキシやその他の特殊な設定はありますか？

[thedavidprice (David Price)]

更新
Beta3 へのアップグレードにより、問題が発生していた多くのユーザーにとって、その問題は解消されたようです。祈りましょう！

関連：プロキシ/セットアップ
ネットワーク DNS には Cloudflare 1.1.1.1 を使用していますが、それ以外のカスタム設定はありません。

広告ブロッカーに関連している可能性はないかと考えています。例えば、Chrome のシークレットモードでは正常に動作するが、通常モードでは動作しないという報告がいくつかありました。

まだ原因がつかめません…