PCのブラウザでMastodonの投稿フォームにハッシュタグを追加するブックマークレット

　Twitterでは途中からブックマークレットが使えなくなったのだけどTweetDeckでは使えてて、ツイートする前の文字数をカウントする私のフォームでも使っていた、ハッシュタグを追加するブックマークレットをマストドンで使ったら、投稿前にハッシュタグが消えてしまうトラブルが発生して、そのことを投稿したら親切な人が原因と解決策を教えてくれた。

Mastodon には react が使われているため、度々それ由来の罠にはまることがあります。投稿欄の文言を変更する操作なんかがそれです。そのままだと変更できたように見えて実はできていない状態になってしまいます。 （Mastodon の投稿欄をブックマークレットでいじるコツ - ゆるめ）

　そこに書いてあるソースを基にブックマークレットを作ると、ブックマークのURLに次のように書く。

javascript:(function(){const tootArea = document.querySelector('.compose-form textarea');const replacedText = tootArea.value.replace(/$/, ' #ハッシュタグ');Object.getOwnPropertyDescriptor(Object.getPrototypeOf(tootArea), 'value').set.call(tootArea, replacedText);tootArea.dispatchEvent(new Event('input', { bubbles: true }));})();

#ハッシュタグ

「document.querySelector('.compose-form textarea');」はマストドンのソース内の「class="compose-form"」内の<textarea>のことらしい。
私はマストドン以外の例えば私が作ったフォームでも使いたいので少し修正する必要がある。

　私が使っていた元々のブックマークレットは次のようなものだった。

javascript:(function(){var STR=' #ハッシュタグ';var%20box=document.activeElement;box.focus();box.value+=STR;})();

教えてもらったソースを参考に修正して次のようにした。

javascript:(function(){var STR=' #ハッシュタグ';var%20box=document.activeElement;box.focus();replacedText=box.value+STR;Object.getOwnPropertyDescriptor(Object.getPrototypeOf(box),%20'value').set.call(box,%20replacedText);box.dispatchEvent(new%20Event('input',%20{%20bubbles:%20true%20}));})();

#ハッシュタグ

　上のブックマークレットは問題なく使えたけれど、「Object.getOwnPropertyDescriptor」以降のソースの意味や使い方を理解しているわけではない。今は時間がないので理解するのは後回し。

追記：2024/4/6

Gemini作、ハッシュタグ追加ブックマークレット作成フォーム

ハッシュタグ置き換えツール

このツールは、上記のブックマークレットコード中の「#ハッシュタグ」部分を、入力したテキストに置き換えたブックマークレットを作成します。

ハッシュタグ: