DEV: Display feedback in the Glimmer post menu on iOS / iPadOS devices (#30594)

This commit introduces a workaround for a behavior observed in Safari for iOS / iPadOS where the feedback message wasn't being displayed after clicking on the copy button in the Glimmer post menu
This commit is contained in:
Sérgio Saquetim 2025-01-07 14:37:14 -03:00 committed by GitHub
parent 9b4dfbbbfe
commit 7fd2fb6b85
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -1,3 +1,4 @@
import { next } from "@ember/runloop";
import { SVG_NAMESPACE } from "discourse-common/lib/icon-library";
import { i18n } from "discourse-i18n";
@ -43,7 +44,11 @@ export function showAlert(postId, actionClass, messageKey, opts = {}) {
const actionBtn =
opts.actionBtn || document.querySelector(`${postSelector} .${actionClass}`);
actionBtn?.classList.add("post-action-feedback-button");
// using `next` here is a workaround for a behavior observed in Safari for iOS / iPadOS
// that somehow trigger Ember to restore the button's original classes
next(() => {
actionBtn?.classList.add("post-action-feedback-button");
});
createAlert(i18n(messageKey), postId, actionBtn);
createCheckmark(actionBtn, actionClass, postId);
@ -73,7 +78,12 @@ function createCheckmark(btn, actionClass, postId) {
}
function styleBtn(btn) {
btn.classList.add("--activated", "--transition");
// using `next` here is a workaround for a behavior observed in Safari for iOS / iPadOS
// that somehow trigger Ember to restore the button's original classes preventing the message/checkmark from being
// displayed
next(() => {
btn.classList.add("--activated", "--transition");
});
setTimeout(
() => btn.classList.remove("--activated"),
TIMEOUT - TRANSITION_BUFFER