Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
59
Help us understand the problem. What is going on with this article?
@ulwlu

Qiitaのサイトバグを見つけた 👉 原因見つけて報告 👉 一瞬で修正してくれた

それだけの記事ですが、Twitterでわちゃわちゃした内容なので一応経緯をメモ

バグの内容

Qiitaは通知が100件以上になると、「99+」と表示される仕様がありました。
しかし実はそのアルゴリズム、『トレンド画面』しか効いておらず、他の画面では『素の数字』が表示されていたのです。




他にも、結構通知を貯金されて気づいていらっしゃる方がいたんですね。Qiitaで有名なsuinさんまで・・・





『13954件ってなんだよ(羨望)(感動)』

早速Qiitaのコードをみてみる

【1/2】トレンド画面

68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3235373130382f39336430633466342d356661392d346365632d313962382d6238613637383464336262372e706e67.png

【2/2】それ以外の画面

68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3235373130382f62616466396432662d633661352d613165662d373232352d6232366436376135393738622e706e67.png

既に構造が変わっていますね。
特にglobalHeaderなるidが、トレンド画面にしか存在していないのが気になります。
多分セレクタミスをしているのでしょうね。

スクリプトを調査するため、Source画面でJSファイルを掘り出してみましょう。
なんとなくちらつきがあるんでフロントで実装してると思うので多分ブラウザからみれそうです。

スクリーンショット 2019-04-11 21.41.57.png

qiita用のCDNが怪しいですね。早速見てみましょう。セレクタが不明なので、「99+」で検索してみます。

スクリーンショット 2019-04-11 21.47.19.png

い ま し た

変数名からして、こいつが99%悪さしてそうですね(99+だけに)。
中のコードはmin(最小化)されているので、beautifyして正体を顕にしてあげましょう
使うサイトはこちら⇛ https://beautifier.io/

これ👇を・・・
スクリーンショット 2019-04-11 21.44.55.png

こう👇します!
スクリーンショット 2019-04-11 21.45.04.png

変換したらsyntaxの効いているエディタにコピペして、解析を始めてみましょう。
スクリーンショット 2019-04-11 21.51.28.png

ここの部分ですね。

99<t.unreadNotificationsCount?"99+":t.unreadNotificationsCount
  • unreadNotificationsCountが99より大きい場合、"99+”に書き換える。
  • それ以外の場合は、unreadNotificationsCountのまま。

この処理が、トレンド画面にしか反映されていないわけです。
トレンド画面以外のページでは、「スキップしている」or「前の処理でエラーを起こしてしまっている」の2パターンが考えられますね。

そしたら色々、前の方の条件式を見てみるか・・・
あ り ま し た

スクリーンショット 2019-04-11 21.56.39.png

やっぱりglobalHeaderじゃないか!
関数の中まで追うまでもなく、このglobalHeaderが存在しないページでは以降の処理に不具合が出る事が想定されますね。
ここまでの検証はパッと5分程でした。

Qiitaに報告

Qiitaのお問い合わせからバグを報告してみます。

D33UNOqU4AE-Gzd.jpeg

こういうissue文が一番、プログラマーに文才を求められる瞬間ですね。
読み返すと非常に読みづらい・・・githubでこんなissue文書いたら、弾かれそうですね(笑)

結果

2時間で直してくれました。
神対応すぎる、さすがQiita様!

まとめ

全然技術的な話が無くって申し訳ありません。改めて、光速の対応をして頂いたQiita運営様、本当にありがとうございました。(できれば99+の方ではなく、無制限表示の方が嬉しいです・・・)

おまけ

59
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ulwlu

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
59
Help us understand the problem. What is going on with this article?