Details directive not redering properly with dirhtml builder

[mhostetter]

Like you all, I am using the sphinxcontrib-details-directive .. details:: directive. A while ago I noticed it stopped working (not appearing as a dropdown section). I also noticed you all did some work on patching that directive (https://github.com/jbms/sphinx-immaterial/pull/45).

Today I tried to get that directive working again. I'm replicating your use of .. details:: in this project's docs and just can't reproduce the functionality. Any thoughts?

I'm using the latest everything:

• sphinx v5.3.0
• sphinx-immaterial from commit 000192d93f925f2287d5edab58ac681472653ffb (latest on main)
• sphinxcontrib-details-directive v0.1.0

Example

foo-183.zip

.. details:: Details with no class

   This is a details section.

.. details:: Details with 'example' class
   :class: example

   This is a details section.

renders as

Build output

```console $ rm -rf docs/build && rm -rf docs/api && sphinx-build -b dirhtml -v docs/ docs/build/ Running Sphinx v5.3.0 /usr/lib/python3/dist-packages/requests/__init__.py:89: RequestsDependencyWarning: urllib3 (1.26.11) or chardet (3.0.4) doesn't match a supported version! warnings.warn("urllib3 ({}) or chardet ({}) doesn't match a supported " making output directory... done locale_dir /mnt/c/Users/matth/repos/foo-183/docs/locales/en/LC_MESSAGES does not exists loading intersphinx inventory from https://docs.python.org/3/objects.inv... loading intersphinx inventory from https://numpy.org/doc/stable/objects.inv... locale_dir /mnt/c/Users/matth/repos/foo-183/docs/locales/en/LC_MESSAGES does not exists building [mo]: targets for 0 po files that are out of date building [dirhtml]: targets for 1 source files that are out of date updating environment: locale_dir /mnt/c/Users/matth/repos/foo-183/docs/locales/en/LC_MESSAGES does not exists [new config] 1 added, 0 changed, 0 removed reading sources... [100%] index looking for now-outdated files... none found pickling environment... done checking consistency... done preparing documents... done writing output... [100%] index generating indices... genindex done writing additional pages... done copying static files... done copying extra files... done dumping search index in English (code: en)... done dumping object inventory... done Generating sitemap for 2 pages in /mnt/c/Users/matth/repos/foo-183/docs/build/sitemap.xml build succeeded. The HTML pages are in docs/build. ```

HTML of index.html

```html

foo¶

Details with no class

This is a details section.

Details with ‘example’ class

This is a details section.

---

Last update: Nov 01, 2022

```

[mhostetter]

My docs appear to use a simple <div> section

where your docs use a <details> section

[2bndy5]

I can't reproduce this from the example project you uploaded. Note, that I started a fresh python env to test the example submitted. At first, I removed the dependency for sphinx-design (not actually used in the example). After the admonitions rendered correctly, I re-enabled (& installed) sphinx-design. The results were the same regardless (expected behavior).

In looking at your posts, the fact that div elements were used indicates (to me) that the DetailsTransform isn't getting used in the ext. This might happen if the sphinxcontrib-details-directive ext is not installed correctly. I was worried about sphinx-design overriding the transformation, but that doesn't seem to be the case.

[2bndy5]

-b dirhtml

This might have something to do with the lack of transformation (from div to details/summary elements). I inspected the CI build of our docs with the dirhtml builder, and it shows the same problem:

This isn't really a problem with the theme because the DetailsTransform class is registered only for the html builder. It should be possible to add the dirhtml builder to the transform in our monkeypatch though.

A quick test build using the dirhtml builder for our docs with the following patch

--- a/sphinx_immaterial/details_patch.py
+++ b/sphinx_immaterial/details_patch.py
@@ -3,7 +3,7 @@ from docutils import nodes

 try:
     from sphinxcontrib.details.directive import (  # pytype: disable=import-error
-        DetailsDirective,
+        DetailsDirective, DetailsTransform
     )

     IS_INSTALLED = True
@@ -36,3 +36,4 @@ def monkey_patch_details_run():

 if IS_INSTALLED:
     monkey_patch_details_run()
+    DetailsTransform.builders = ("html", "dirhtml")

renders the .. details:: directives properly.

[mhostetter]

@2bndy5 thanks for finding and resolving this!