サイトへのリンクを投稿していただけますか?テーマのスタイルが原因である可能性があります。
ここに私のリンクがあります。
https://whois.nhachinhchu.org/t/bang-gia-xem-data-nha-chinh-chu/63389
このアップデート以降、目次がある discourse-docs ページでエラーが発生しています。例えば、Meta のこのページ では ToC が表示されず、ブラウザの開発者ツールにエラーが表示されます。
私のサイトでも、ページ上部に「サイト上の投稿コンテンツデコレーターのいずれかがエラーを発生させたため、投稿が正しく表示されない可能性があります。詳細については、ブラウザの開発者ツールを確認してください。」というバナーが表示されます。
@simonkさん、ありがとうございます。ちょうど2分前にその問題の修正をマージしました。サイトのコンポーネントを更新して、ご自身のサイトのバナーが引き続き表示されるかどうか教えていただけますでしょうか。
返信ありがとうございます!エラーは解消されましたが、ページをdiscourse-docsバージョンで表示した場合、目次が表示されません。昨日までのアップデートでは、目次は「通常の」バージョンだけでなく、discourse-docsバージョンでも表示されていました。
(私にとっては緊急ではありません。アップデートは本番環境ではなくステージングサイトにデプロイしたので、正常に動作しなくても問題ありません。)
編集:バージョンは2.8.0.beta11(42c71789f9)です。何か関係があれば。
ええ、おっしゃることはわかります。残念ながら、TOCへの変更はトピックビューのアウトレットを使用していますが、ドキュメントにはそれがありません。確認します。
本日、コンポーネントにいくつかの変更を加えました。これらは、@mentalstring および @simonk が提起した問題に対処するはずです。Simon の場合、ドキュメントプラグインの更新もプルする必要があるため、完全な再構築が必要です。
@huynhthai824 あなたの問題は、コンポーネントを更新すれば解決する可能性が非常に高いです。
どうもありがとうございます。とても嬉しいです。問題が解決しました。
改めて感謝します。
完全な再構築の後、discourse-docs ページで目次が正しく表示されることを確認できました。ありがとうございます ![]()
目次が2レベルに制限されていることもわかりました。横幅を考えるとこれは妥当だと思いますが、3レベルの見出しが親と同じネストレベルで目次に表示されることになります。
つまり、現時点ではこのテキスト:
# First Heading
## First Subheading
### Child of First Subheading
### Child of First Subheading
## Second Subheading
### Child of Second Subheading
### Child of Second Subheading
# Second Heading
この目次を生成します:
3レベル以上の見出しは目次から完全に除外した方が良いのではないでしょうか?
また、DOM構造も正しくないようです。各2レベル項目は、単一の <li> を含む <ul> になっています:
よく気づかれました。3レベル以上をどのくらいの頻度で使用するかはわかりませんが、再導入することは可能です。それほど複雑ではないはずです。
また、よく気づかれました。これは小さなミスでした。このPRがマージされれば修正されるはずです。
機能リクエストの気分であれば、最大深度は設定で制御できるかもしれません… ![]()
私の経験では、目次機能は最初の投稿でのみ機能し、それ以降の投稿では機能しません。これは正しいですか?もしそうなら、私の発言を機能リクエストとして扱うことはできますか?ちなみに、目次は最初の投稿でも非常に素晴らしい追加機能です。R
こんにちは、皆さん。この素晴らしいテーマコンポーネントの最後のアップグレード以降、モバイルでのみ問題が発生しています。目次ボタンをクリックしても、目次全体が表示されるスライダーが開きません。
デスクトップで非常に小さいウィンドウを使用すると、このボタンとスライダーは正常に機能します。したがって、Androidのみの問題である可能性があります。
以下は、最新の状態(DiscourseとTOC)のフォーラムでのログです。
メッセージ
TypeError: Cannot read properties of null (reading 'classList') が発生しました
URL: https://iunctis.fr/theme-javascripts/671f772e071bd55050592ff8541b659afe421259.js?__ws=iunctis.fr
行: 36
列: 49
ウィンドウの場所: https://iunctis.fr/t/le-mensuel-01-decembre-2021/9591
バックトレース
TypeError: Cannot read properties of null (reading 'classList')
at n.showTOCOverlay (https://iunctis.fr/theme-javascripts/671f772e071bd55050592ff8541b659afe421259.js?__ws=iunctis.fr:36:49)
at e.n._join (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:412333)
at e.n.join (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:409358)
at h (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:273784)
at https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:65110
at a (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:260923)
at https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:65054
at n._triggerAction (https://iunctis.fr/assets/application-945e3f0cb654a8c23b30e86f5e955be5599a8330d68ce75e97b8228ad45ff6fd.js:1:1254524)
at n.click (https://iunctis.fr/assets/application-945e3f0cb654a8c23b30e86f5e955be5599a8330d68ce75e97b8228ad45ff6fd.js:1:1254160)
環境
HTTP HOSTS: iunctis.fr
Firefoxデスクトップ版でAndroidユーザーエージェントを使用すると、このフォーラムのボタンをクリックしたときに次のエラーが発生します。
TypeError: document.querySelector(...) is null が発生しました
showTOCOverlay 4916e6ed2a984e00537fe797b799637f1a801ffe.js:374
_join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4033
join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3999
p _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2870
An _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:1147
o _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2785
An _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:1147
_triggerAction _application-2646ad3bbed41e42bb77806dc41fbea2.js:489
click _application-2646ad3bbed41e42bb77806dc41fbea2.js:488
trigger _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2560
n _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2422
_run _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4034
_join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4033
join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3999
p _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2870
handleEvent _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2574
o _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2785
handleEvent _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2574
handleEvent _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2499
setupHandler _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2524
dispatch _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:347
handle _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:342
add _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:342
Oe _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:339
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:123
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:116
Oe _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:339
on _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:358
initialize _application-2646ad3bbed41e42bb77806dc41fbea2.js:3354
initialize _application-2646ad3bbed41e42bb77806dc41fbea2.js:62
runInstanceInitializers _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2730
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4074
walk _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4064
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4056
topsort _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4056
_runInitializer _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2733
runInstanceInitializers _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2730
_bootSync _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2604
didBecomeReady _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2623
invoke _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3963
flush _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3955
flush _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3969
_end _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4032
end _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3988
_run _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4034
_join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4033
join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3999
p _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2870
bind _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2873
u _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:272
c _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:273
setTimeout handler*a/\u003c _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:274
l _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:265
fireWith _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:266
fire _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:266
l _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:265
fireWith _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:266
ready _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:283
z _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:283
EventListener.handleEvent* _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:283
\u003canonymous\u003e _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:109
\u003canonymous\u003e _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:109
4916e6ed2a984e00537fe797b799637f1a801ffe.js:374:18
私の携帯電話では、Chromeバージョン97.0.4692を使用しています。参考になれば幸いです。
私だけがこれを経験していますか?
これはコアの変更による最近の回帰です。FIX: Restore outlet in mobile views by pmusaraj · Pull Request #15683 · discourse/discourse · GitHub で修正を用意しました。マージされたら、サイトを再構築すると問題が解決するはずです。ご迷惑をおかけしました。
先週、Simon が上記で言及したように、コンポーネントにヘッダーの 3 番目のインデントレベルを戻しました。
ここでは設定を追加することに躊躇しています。大多数のユースケースでは必要ありません。また、コンポーネントには各レベルのクラスもあるため、4 番目と 5 番目のレベルを非表示にしたい場合は、この CSS で行うことができます。
li.d-toc-h4, li.d-toc-h5 {
display:none;
}
マージされ、正常に動作しています。ありがとうございます!
トピックの先頭にある <div> 要素が余分なマージンを発生させていることに気づきました。たとえば、次のようになります。
これをテーマに追加したところ、修正されたようです。
// ToC要素が投稿の先頭にあると、不要なスペースが発生します。
// Discourseは投稿内の最初の要素の上マージンをゼロに設定しますが、
// ToCが最初の要素である場合にはこれは機能しません。
// 代わりに、ToCに続く要素の上マージンをゼロに設定します。
div[data-theme-toc="true"] + * {
margin-top: 0px;
}
おそらく、コンポーネントに同様のものを追加する必要があるのではないでしょうか。
よく気が付きましたね。このPRでそのCSSルールを追加しました: UX: Keep core's top margin for first item in OP by pmusaraj · Pull Request #30 · discourse/DiscoTOC · GitHub
この問題には以前、埋め込みコードを投稿の末尾に移動させることで対処してきました。少しハッキーな感じはしますが、機能します。
本文に余分なDIVがある投稿があります。例:On Storytelling - Workbench - Podcaster Community
TOCの生成をトリガーするDIVはDIVの中にあり…TOCはそれに気づきます。しかし、DIVの中にある他の見出しは、TOCに気づかれないようです。
…最高のスクリーンショットではありません。これは、TOCに表示されない、arbitrary/just-for-styling DIV内のH2です。
…表示されていないのは、クレイジーな属性/値のペアを持つDIVの中にある、TOCをトリガーする <div です…
後で更新:見出しがスコープの直接の子であることを要求するのではなく、単に「:scope h1」などにするだけではどうか?
…また、これは21年3月に言及されました。DiscoTOC - automatic table of contents - #255







