Firefox 57 になってしまって利用していたアドオンが死亡してしまって凄い困っていて寝ることができないので頑張ってなんとかしようと試行錯誤するメモ

ESRユーザーも~~2018/03になったら遭遇するかもしれない~~2018/06には確実に遭遇するのでその時までとかに対応策とか今困っているとかそんなメモ
適宜更新中
殴り書きなのでCtrl+Fで検索バー出して検索すると良いと思う

頑張る最初の一歩

とりあえずProfileのバックアップを取る

Firefox 57になった瞬間「やべっ！」って思ってからでもとりあえず手動コピーでいいから取るべき。自分は一回ブラウザ再起動を挟んでしまったせいでこのコピーが無くて泣けることになっている可能性がある。ちなみにその後でもいいから早いタイミングで取るのが吉。たぶん下のフォルダ当たりに入っている

C:\Users\%USERNAME%\AppData\Roaming\Mozilla\Firefox\Profiles\

良くわからない場合はアドレスバーに以下の文字列を入れてエンター

about:profiles

表みたいになっているやつの既定のプロファイルがはいになっている下に、ルートディレクトリーというのがあってそのフォルダが、バックアップ取りたいプロファイルのパスになる。

どうしようもない古いアドオンを確認する

たぶんたくさんある。たくさんあった。
ちなみにアップデートを止めていたものも対応していないバージョンで止めていたら勝手にアップデートされる。はてブのアドオンとか強制的にv3系列になってはてブ引退すら考えさせられる。はてブ何もできない。適当にブックマークレット作って凌いでいる。

javascript:void%20window.open('http://b.hatena.ne.jp/entry?url='+location.href);

はてなハイクで教えて貰ったけど下記のやつはhttps対応版。上記の適当ブックマークレットと比較してちゃんとできているはず。ちなみにどっちもTwitterでは動かない。

javascript:void%20function(){(function(){function%20t(t){window.open(t)||(location.href=t)}url=document.location.href,t(%22http://b.hatena.ne.jp/entry/%22+(url.match(/^https/)%3F%22s/%22:%22%22)+url.replace(/https%3F:\/\//,%22%22))})()}();

使えないアドオンをどうするか

アップデート対応してくれそうなアドオン

作者に感謝。マジ感謝。応援する。NoScript~~とかこれ~~は無事対応してくれた。UIに色々言いたいことあるかもしれないけど今後の発展に期待！ありがてえありがてえ！

実は名前変わってアップデート対応しているよ！なアドオン

圧倒的感謝。KeeFoxは名前がKeeに変わっているけど同じ作者だから安心しよう。

1. アップデート対応してくれなさそうなアドオン

代替アドオン探す。Firefox公式の代替アドオン探すよ機能は意外と全然使えない。ポンコツ。~~問題に直面しているアドオンがいっぱい見つかるかも。~~同じ作者が後継だしているアドオンを適切に探してくれなかったりするので、about:addons から該当するアドオンの作成者を開いて探すと実は対応しているアドオンを別に出している可能性がある。これは、古いアドオンを使う人達に対してアップデートを提供し続ける目的があると思われる。

ただアドオンなくても案外いけんじゃね？

アドオンは少ない方が軽い。下のRoomy Bookmarks Toolbarの解決策にちょこっと書いたけど案外userChrome.cssでもできるかも。
っというかcss使うのが基本戦略になる

userChrome.cssはどうやればいいのか？

userChrome.cssわからん時は導入方法を下のRoomy Bookmarks Toolbarの解決策のとこに入れ方書いてあるのでそれで導入する。
userChrome.cssわかるぜって人はCustomCSSforFxっていう神まとめがあるのでそれを参考にすれば、このページはもう見なくて自己解決できると思う。
README.mdにも書いてあるけど、Classic Theme Restorer、Classic Toolbar Button、GlassMyFox、NoiaButtons あたりを使っていて困っている人は問題を解決できると思う。
何故言い切れるかと言うとこれらのアドオンの作者がgithubでCustomCSSforFxをまとめている人と同一人物だからである。

書かれていないけどuserChrome.cssでできそうなことは、README.mdに書かれている"How to find item ids and attributes?を参考に開発ツールを使えばカスタマイズしたいやつの名前とか特定する方法が書いてある。
親切。神。圧倒的感謝。

今問題に直面しているアドオン達

Roomy Bookmarks Toolbar

解決案：css書けばなんとかなるらしい。%USERNAME%と%PROFILE_NAME%は人によって違うから適宜読み替える。
あと適宜コメントアウトして自分が使いやすいようにカスタマイズ。
chromeフォルダがないなら作る。userChrome.cssないなら作る。userChrome.cssはnotepad.exeで編集できるけどvimがおすすめ。

C:\Users\%USERNAME%\AppData\Roaming\Mozilla\Firefox\Profiles\%PROFILE_NAME%.default\chrome\userChrome.css

/* Recreates the basic functionality of the popular Roomy Bookmarks Toolbar add-on:
Hide bookamrks bar items label text, show on hover. */
.bookmark-item > .toolbarbutton-text {
  margin-top: -1px !important;
}
.bookmark-item:not(:hover):not([open="true"]) > .toolbarbutton-text {
  display: none !important;
}

#PlacesToolbarItems > .bookmark-item:not(:hover):not([open="true"]) > .toolbarbutton-icon[label]:not([label=""]) {
  margin-inline-end: 0px !important;
}

/* hide names on the Bookmarks Toolbar */
#PlacesToolbarItems > .bookmark-item > .toolbarbutton-text {
  display:none !important;
}

/* Reduce space between bookmarks and decrease bookmarks icon */
.bookmark-item > .toolbarbutton-icon {
  height: 14px !important;
  width:  14px !important;
  margin:-2px !important;
  padding:0px !important;
}

出典元：Roomy Bookmarks Toolbarのレビューページ
レビューページで役に立つ情報を残してくれた方々（順不同敬称略）：TheArchitektas, Grég, cest_moi_hihi_haha, Anass
ちなみにブックマークバーの複数行化は同レビューページのRJ Ray氏が下記のソリューションを書き込んでくれている(勝手日訳)。

1) "about:config" を開く
2) "browser.places.smartbookmarksversion" を見つける
3) 項目を右クリックして数字を 1, 2, 3, など 表示したい行数を入れる

ちなみに自分は複数行必要ないから上のは未検証。ほんま動くんかな？不安なのでredditで見かけたuserChrome.css版もメモ
アドオン的にはMultirow Bookmarks ToolbarとかMultirow Bookmarks Toolbar Plusのソリューションになるのか？使っていないからよくわからない。jscher2000氏の投稿に一方的に感謝。

/* Multi-Row Bookmarks Toolbar */
#PersonalToolbar {
  /* Provide room for up to 4 rows at 26px */
  max-height: 104px !important;
}
#PlacesToolbarItems > box {
  display: inline-block !important;
}
#PersonalToolbar #PlacesToolbarItems {
  /* Override hiding */
  overflow-x: visible !important;
  overflow-y: visible !important;
  /* Add a little cushion */
  padding-bottom: 1px;
}
#PersonalToolbar #PlacesToolbarItems .bookmark-item {
  /* Reduce padding on individual bookmarks to fit rows closer together */
  padding-top: 1px !important;
  padding-bottom: 1px !important;
}

Comment Blocker

コメント消してくれる。継続して無いと超困るわけでもない。
めんどいけどuBlock Originでチマチマ消すとか。

Cookie Controller

クッキー管理できるやつ。Firefox 57以降では現在クッキー周りの調整ができないバグ？仕様？になっているらしい（修正予定はあるらしいけど…）。
クッキーうまく管理できる方法ないかなぁ…？

NoScript

これないと死ぬ不安。公式曰く、あともうちょっとだけ待ってくれってところまでは行っているらしいが果たして。
2017/11/20 日付変わった頃もうちょっと！週単位じゃなくて日単位だから！！とのこと。しょうがないにゃ～…
2017/11/21 日本時間夕方頃に対応頂けました！感謝！圧倒的感謝！！！

Tab Mix Plus

タブ100個ぐらい開きっぱなしとかだとこれないと辛い。開発しないわけではないけど到底間に合わないとのこと。
開発は頑張ってくれているので応援。先にFirefox 57が導入されたけど、nightlyの開発状況見ているとちょっと待てばリリースされそう。
公式フォーラムのニュースのところで対応策教えてくれる人がチラホラ
取りあえず検索バーとブックマークバーから開くページを新しいタブにするにはabout:configでいける。下の二つをTrueにする。

browser.tabs.loadBookmarksInTabs
browser.search.openintab

userChrome.cssで色々対応もできそう。例えばタブを複数行表示する（2つ目の代替案の方がなんとなく良い）とか、ホバーしたら閉じるボタン表示するやつとか

C:\Users\%USERNAME%\AppData\Roaming\Mozilla\Firefox\Profiles\%PROFILE_NAME%.default\chrome\userChrome.css

/* Display multi row for tab */
/* not bad but better solutions avaliable */
/* .tabbrowser-tabs .tabbrowser-arrowscrollbox,
.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox,
.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox > box
{
  display: block !important;
} */
/* Showing close button on tabs */
.tabbrowser-tab:not(:hover) .tab-close-button{ display:none; }
.tabbrowser-tab:not([pinned]):hover .tab-close-button{ display:block !important; }

タブを複数行表示は、上のだと全部出しきるまで複数行つくってしまうため、代替案が必要かも。
こっちの方が良い~~かもしれない。まだ試していないけど下記のコードになる~~。
タブの整列しようとDrag and dropで順番入れ替え用とするとなんかバグる。うーむ。

/* Display multi row for tab (alternative) */
.tabbrowser-tab {
  flex-grow:1;
  min-width:150px;
}
.tabbrowser-tab,.tab-background {
  height:29px;
}
.tab-stack {
  width: 100%;
}
.tabbrowser-tabs .scrollbox-innerbox {
  display: flex;
  flex-wrap: wrap;
}
.tabbrowser-tabs .arrowscrollbox-scrollbox {
  overflow: visible;
  display: block;
}
.tabbrowser-tabs .scrollbutton-up,.tabbrowser-tabs .scrollbutton-down,#alltabs-button{
  display: none;
}

閉じるボタンが消えるのでホバーしたときに出したいから下記の設定をした~~けどうまく動いていない~~らうまく動いた。

/* Showing close button on tabs */
.tabbrowser-tab:not(:hover) .tab-close-button{ display:none; }
.tabbrowser-tab:not([pinned]):hover .tab-close-button{ display:block !important; }

User Agent Switcher

代替アドオンが結構ありそうのでそこから探す。

Vertical Toolbar

最近のディスプレイは横に広いからアドオンバーは下じゃなくて横に置いていた。
まぁはてブアドオンが死んだ今いらないかも

Session Manager

こいつが死んで開いていたタブがなくなった。今一番オワタになっている。凄く便利だったのが開いていたタブに関する前後の履歴も保存してくれていたこと。
それが今のAPIには存在しないらしくどうしようもないらしい。困った。とりあえず開いていたタブだけ簡単に復活させたいけど良い方法が見当たらない。
手動で1個1個戻すしかないのだろうか。うーむ。
ひとまず履歴は一旦諦めてタブの復活だけ…

一旦56.0.2にダウングレードしてセッション読み込む→（念のためセッションのバックアップとか、設定のバックアップしておくと良いかも？）→そのまま57.0へアップデート→一発目はセッション生きているのでタブは生きている→Tab Session Managerを入れる→現在のセッションを保存
これでとりあえずタブは生き返る。ただ、Tab Session Managerは前回のタブを文字通り開き直すから100とかあると100タブ分1つずつ開き出す。
これじゃない感がすごいあるのでセッションの保存方法は代替案を検討中。けどとりあえずは安心。
v1.5.0以降のTab Session Managerを入れる→Session Managerの.sessionファイルを読み込む　でよくなったそうだ（未検証）。設定画面から読み込めそう。
.sessionファイルわからねーとかそういう場合は上の打ち消し線入っている手順がわかりやすいかも。

アップデート無いけどまぁもういいかなって思うアドオン

Cleanest Addon Manager

アドオンページそんなに開かないからもういいや…

アドオンじゃないけど困っている

ブックマークのフォルダアイコン色

ブックマークツールバーとかにあるフォルダのアイコンの色がグレーになって見えづらい。
内容的にはアドオンで言うところのBookmarks Favicon Images とか使っていた人向けにもなるかも？
Firefoxサポートフォーラムのjscher2000氏によるuserChrome.cssのソリューション。またjscher2000氏だった。あなたが神か。

/* Colored bookmark sidebar, toolbar, menu button containers */
  /* Standard folder */
  #bookmarks-view treechildren::-moz-tree-image(container),
  #PlacesToolbarItems toolbarbutton[container="true"] .toolbarbutton-icon,
  #PlacesToolbarItems menu[container="true"] .menu-iconic-left,
  #BMB_bookmarksPopup menu[container="true"] .menu-iconic-icon {
    fill: gold !important;
  }
  /* Live Bookmark (RSS Feed) */
  #bookmarks-view treechildren::-moz-tree-image(container, livemark),
  #PlacesToolbarItems toolbarbutton[container="true"][livemark="true"] .toolbarbutton-icon,
  #PlacesToolbarItems menu[container="true"][livemark="true"] .menu-iconic-left,
  #BMB_bookmarksPopup menu[container="true"][livemark="true"] .menu-iconic-icon {
    fill: orange !important;
  }
  /* Smart bookmark folder */
  #bookmarks-view treechildren::-moz-tree-image(container, query),
  #PlacesToolbarItems toolbarbutton[container="true"][query="true"] .toolbarbutton-icon,
  #PlacesToolbarItems menu[container="true"][query="true"] .menu-iconic-left,
  #BMB_bookmarksPopup menu[container="true"][query="true"] .menu-iconic-icon {
    fill: dimgray !important;
  }
  /* These "containers" are SVG in the sidebar, not yet on the menu */
  #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) {
    fill: olive !important;
  }
  #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) {
    fill: olive !important;
  }
  #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) {
    fill: olive !important;
  }

上のcssだとFirefoxのデフォテーマでちょっと明るすぎる気がする。css的にfillで色を指定しているだけだから好みの色に変更することができるとは思う。
ただ、フォルダが気に入らない、という説もあるのでfavicon変更的なことをしたかったら下記のcssが参考になるかも。
hogehogeはラベル名に変更することと、file:///C:/path/to/icon/folder.icoのファイルパスは適宜変更。

.bookmark-item[container="true"][label="hogehoge"] {
  list-style-image: url('file:///C:/path/to/icon/folder.ico') !important;
  -moz-image-region: rect(0px 16px 16px 0px) !important;
}

ラベル名単位で変更フォルダを指定できるのと、複数あるならカンマで繋げて同時に変更管理できるから結構便利かも。
下はfooというフォルダ名とbarというフォルダ名を持つフォルダのアイコンが変わる。

.bookmark-item[container="true"][label="foo"],
.bookmark-item[container="true"][label="bar"] {
  list-style-image: url('file:///C:/path/to/icon/folder.ico') !important;
  -moz-image-region: rect(0px 16px 16px 0px) !important;
}

出典元：たくさんあるけどfaviconが出ない場合の対策例（？）付きということでこの辺が参考になるかも。
もしかしたらこの仕組みと上の仕組みを組み合わせたら一括でフォルダが変更できるかもしれないけどフォルダ2つしかないから未検証。
あとurlの中身をbase64して画像をcssに埋め込むことはできるはず。

タブで右クリックした時のコンテキストメニューが使いづらい

そろそろuserchrome.css関連まとめてくれてる人いねーのかよ、githubでやったら楽そうじゃん…とか思っていたらやってくれている人(Aris-t2/CustomCSSforFx)いた。神。
タブで右クリックしたときについてのcssからそれっぽいの選んで消せる。
たぶん上から表示されている順で並んでいるから英語でもそこまで問題ない。親切。圧倒的感謝。なんなら /* */の間を翻訳にかければだいたいわかるはず。
例えば"他のタブをすべて閉じる"とかタブを100個ぐらい開いて使っている人にとっては無用な奴は以下のコードをuserChrome.cssに書いて消せる。

/* hide 'Close Other Tabs' menuitem */
#tabContextMenu #context_closeOtherTabs {
  visibility: collapse !important;
  display: none !important;
}

他のサイト見ると、上のbookmarkと似た方法でlabel="他のタブをすべて閉じる"とかで指定する方法もチラホラ見かけたけど言語設定違うと使えないし訳変わったら復活するからあまり推奨できない。
他にも、CustomCSSforFxは有能の塊っぽいので参考になる。
ただ、某掲示板でちらっと見たけどローカルで他のcssファイルをimportするのと、userChrome.cssに全部書くのってどっちがいいんだろうか？
なんとなくimportって遅いイメージあるけどローカルだとそんな気にしなくて良いきもするけど、importするリクエストは起動時に発生するような気がするし、少しでも軽くするなら記述した方が良い気もするけど、長くなってくるとuserChrome.cssのメンテが面倒という…
あとで考えるとしてとりあえず有能神CustomCSSforFxは上の方にリンク貼っとく。

アドレスバーをエンターキーで別タブ開く

Tab Mix Plus関連ともいえる。
~~今のところ解決策見当たらない。~~アドオンで対応できそうかも？今後追記で長くなる可能性もありそうだから別記事に書いた。
古典的に、アドレス打ち込んだ後に飛ぶときEnterではなくAlt+Enterで対応する感じか。
それに慣れるしかないのだろうか？

( ﾟÅﾟ)誰んー？乳酸菌魂でおっぱいがいっぱい覚書的なメモ置き場かもしれない

Σ(*ﾟД`；)ｱ…ｱ…ｱｯﾊｧｧｧｧｧｧｧｧ?!!