Спойлеры не переключаются внутри <details>

Я не на 100% уверен, но, думаю, следующие шаги воспроизводят проблему:

  1. Начните писать новый пост.
  2. Добавьте текст с тегами [spoiler] вокруг него.
  3. Разблурьте текст в превью поста. Обратите внимание, что вы можете разблюровать и заблюровать его столько раз, сколько захотите.
  4. Добавьте ещё текст под спойлерным текстом.
  5. Если вы оставили текст в разблюрованном состоянии, но разблюровали его один раз. Но после этого (или сразу, если он уже был разблюрован) вы больше не можете заблюровать текст.

Это может происходить и в реальных постах, а не только в превью. Я не знаю точных шагов для воспроизведения там (поскольку вы не можете вводить текст между разблюровкой и заблюровкой), но, по крайней мере, в том случае, который я видел, разблюрованный текст находился внутри тегов details. Не знаю, имеет ли это какое-то значение.


Следующее предназначено для тестирования, но может оказаться полезным, а может и нет.

Текст спойлера

Текст после спойлера.

Сводка

Ещё текст спойлера

Ещё текст после спойлера.

Ещё текст после спойлера и тега details.

2 лайка

Я заметил, что спойлеры нельзя выключить, когда они находятся внутри тега <details>.

Этот спойлер можно включать и выключать (работает как ожидается).

Однако в этом случае не работает:

Нажмите, чтобы открыть 'details'

Этот спойлер можно включить только один раз (его нельзя выключить).

Думаю, проблема в том, что во втором случае функция isInteractive возвращает true, потому что details включён в INTERACTIVE_SELECTOR.

Достаточно будет его удалить, но я не совсем уверен, какие будут побочные эффекты (возможно, @CvX знает).

EDIT: Я вижу, что это изменение было мотивировано желанием останавливать GIF-анимации по клику. В нашем сообществе мы активно используем спойлеры и теги details, поэтому было бы полезно сделать поведение размытия более последовательным.

2 лайка

Объяснение

Когда текст-спойлер помещается в блок details, его можно разблокировать, как обычно, кликнув по нему, но повторный клик ничего не делает, и текст нельзя снова скрыть. Закрытие и повторное открытие блока details не помогает. В моём пояснении на форуме Hopscotch это описано подробнее.

Демонстрация

Не стесняйтесь использовать этот блок details в качестве примера. Мой точный процесс описан в теме на форуме Hopscotch.

Блок details

Пример текста

Как воспроизвести

  1. Создайте пост с блоком details.
  2. Поместите в него текст-спойлер.
  3. Откройте блок и разблокируйте текст.
  4. Текст нельзя снова скрыть без перезагрузки страницы.
2 лайка

Спасибо за шаги для воспроизведения. Это небольшая неудобство (особенно поскольку это внутри раскрывающегося блока, поэтому мы можем скрыть содержимое, переключив details), но исправление могло бы быть приветствуемым.
Я добавлю метку pr-welcome к теме, если кто-то захочет попробовать исправить это.

Репозиторий плагина находится здесь: GitHub - discourse/discourse-spoiler-alert: A plugin for discourse to hide spoilers behind the spoiler-alert jQuery plugin · GitHub

Но у меня есть ощущение, что это скорее проблема функции «Скрыть детали».

Содержимое в «Скрыть детали» не всегда отображается (и взаимодействует ли?) так, как ожидается. Например, изображения по прямым ссылкам, ссылки, видео и т. д. не будут отображаться. Будут показаны только ссылки:

Сводка

https://cdn.discordapp.com/attachments/914531040297635861/1107226488534740992/1920x1080.png

https://www.youtube.com/watch?v=ipuqLy87-3A

Apex Legends pro sweet hits Predator rank with no kills to “prove how bad” Ranked is - Dexerto

4 лайка

Спасибо!

1 лайк

Теги [spoiler][/spoiler], расположенные внутри блока [details][/details], не могут, как в обычном тексте, быть нажаты один раз для снятия размытия и снова нажаты для повторного применения эффекта размытия.

Пример:

[spoiler]Текст[/spoiler]

[details]
[spoiler]Текст[/spoiler]
[/details]

Текст

Текст