From 147c91f1d6b071f9779004393df057ba096d22cd Mon Sep 17 00:00:00 2001 From: "Davide P. Cervone" Date: Wed, 9 Jun 2021 13:14:28 -0400 Subject: [PATCH 1/2] Work around WebKit bug with CHTML characters. (mathjax/MathJax#2435) --- ts/output/chtml/Wrappers/TextNode.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/ts/output/chtml/Wrappers/TextNode.ts b/ts/output/chtml/Wrappers/TextNode.ts index 7be2ab889..787e5224c 100644 --- a/ts/output/chtml/Wrappers/TextNode.ts +++ b/ts/output/chtml/Wrappers/TextNode.ts @@ -58,6 +58,19 @@ CommonTextNodeMixin>(CHTMLWrapper) { 'mjx-utext': { display: 'inline-block', padding: '.75em 0 .2em 0' + }, + // + // WebKit-specific CSS to handle bug with clipped characters. + // (test found at https://browserstrangeness.bitbucket.io/css_hacks.html#safari) + // + '@supports (-webkit-marquee-repetition:infinite) and (object-fit:fill)': { + // + // We don't really support nested CSS, so fake it byt putting the CSS + // directly in the string, and commenting out the colon that is + // inserted after the selector (that would normally be a CSS property name) + // See issue #2435. + // + 'mjx-c::before/*': '*/ {will-change: opacity}' } }; From 217eaae3da63a8478273cb60c9925b85d566b0b9 Mon Sep 17 00:00:00 2001 From: "Davide P. Cervone" Date: Thu, 10 Jun 2021 07:59:57 -0400 Subject: [PATCH 2/2] Update css test for Safari to work in more cases --- ts/output/chtml/Wrappers/TextNode.ts | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/ts/output/chtml/Wrappers/TextNode.ts b/ts/output/chtml/Wrappers/TextNode.ts index 787e5224c..e6596b494 100644 --- a/ts/output/chtml/Wrappers/TextNode.ts +++ b/ts/output/chtml/Wrappers/TextNode.ts @@ -63,14 +63,8 @@ CommonTextNodeMixin>(CHTMLWrapper) { // WebKit-specific CSS to handle bug with clipped characters. // (test found at https://browserstrangeness.bitbucket.io/css_hacks.html#safari) // - '@supports (-webkit-marquee-repetition:infinite) and (object-fit:fill)': { - // - // We don't really support nested CSS, so fake it byt putting the CSS - // directly in the string, and commenting out the colon that is - // inserted after the selector (that would normally be a CSS property name) - // See issue #2435. - // - 'mjx-c::before/*': '*/ {will-change: opacity}' + '_::-webkit-full-page-media, _:future, :root mjx-container': { + 'will-change': 'opacity' } };