From 5209d6d1afa947cd757f07f78f62b72b14ec7211 Mon Sep 17 00:00:00 2001
From: "Davide P. Cervone" <dpvc@union.edu>
Date: Fri, 11 Jun 2021 11:08:08 -0400
Subject: [PATCH 1/3] Use 'overflow: clip visible' for stretchy characters to
 avoid unwanted clipping in the non-stretching direction. 
 (mathjax/MathJax#2701)

---
 ts/adaptors/HTMLAdaptor.ts     | 8 ++++++--
 ts/output/chtml/Wrappers/mo.ts | 6 ++++--
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/ts/adaptors/HTMLAdaptor.ts b/ts/adaptors/HTMLAdaptor.ts
index 774a2d2e5..c4a20e411 100644
--- a/ts/adaptors/HTMLAdaptor.ts
+++ b/ts/adaptors/HTMLAdaptor.ts
@@ -69,7 +69,7 @@ export interface MinHTMLElement<N, T> {
   className: string;
   classList: DOMTokenList;
   style: OptionList;
-  sheet?: {insertRule: (rule: string) => void};
+  sheet?: {insertRule: (rule: string, index?: number) => void};
 
   childNodes: (N | T)[] | NodeList;
   firstChild: N | T | Node;
@@ -518,7 +518,11 @@ AbstractDOMAdaptor<N, T, D> implements MinHTMLAdaptor<N, T, D> {
    */
   public insertRules(node: N, rules: string[]) {
     for (const rule of rules.reverse()) {
-      node.sheet.insertRule(rule);
+      try {
+        node.sheet.insertRule(rule, 0);
+      } catch (e) {
+        console.warn(`MathJax: can't insert css rule '${rule}': ${e.message}`);
+      }
     }
   }
 
diff --git a/ts/output/chtml/Wrappers/mo.ts b/ts/output/chtml/Wrappers/mo.ts
index d8c80ae22..99e9b5f49 100644
--- a/ts/output/chtml/Wrappers/mo.ts
+++ b/ts/output/chtml/Wrappers/mo.ts
@@ -65,7 +65,8 @@ CommonMoMixin<CHTMLConstructor<any, any, any>>(CHTMLWrapper) {
       width: 'initial'
     },
     'mjx-stretchy-h > mjx-ext': {
-      overflow: 'hidden',
+      '/* IE */ overflow': 'hidden',
+      '/* others */ overflow': 'clip visible',
       width: '100%'
     },
     'mjx-stretchy-h > mjx-ext > mjx-c::before': {
@@ -103,7 +104,8 @@ CommonMoMixin<CHTMLConstructor<any, any, any>>(CHTMLWrapper) {
       height: '100%',
       'box-sizing': 'border-box',
       border: '0px solid transparent',
-      overflow: 'hidden'
+      '/* IE */ overflow': 'hidden',
+      '/* others */ overflow': 'visible clip',
     },
     'mjx-stretchy-v > mjx-ext > mjx-c::before': {
       width: 'initial',

From b179a3e9372d06822baa53cf4cd55e5ad5d697b7 Mon Sep 17 00:00:00 2001
From: "Davide P. Cervone" <dpvc@union.edu>
Date: Fri, 11 Jun 2021 14:31:34 -0400
Subject: [PATCH 2/3] Use try/catch around the loop for efficiency.

---
 ts/adaptors/HTMLAdaptor.ts | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/ts/adaptors/HTMLAdaptor.ts b/ts/adaptors/HTMLAdaptor.ts
index c4a20e411..f911c66db 100644
--- a/ts/adaptors/HTMLAdaptor.ts
+++ b/ts/adaptors/HTMLAdaptor.ts
@@ -517,12 +517,13 @@ AbstractDOMAdaptor<N, T, D> implements MinHTMLAdaptor<N, T, D> {
    * @override
    */
   public insertRules(node: N, rules: string[]) {
-    for (const rule of rules.reverse()) {
-      try {
+    let rule;
+    try {
+      for (rule of rules.reverse()) {
         node.sheet.insertRule(rule, 0);
-      } catch (e) {
-        console.warn(`MathJax: can't insert css rule '${rule}': ${e.message}`);
       }
+    } catch (e) {
+      console.warn(`MathJax: can't insert css rule '${rule}': ${e.message}`);
     }
   }
 

From 4d36dadba53b87e00925370781f329f763921aac Mon Sep 17 00:00:00 2001
From: "Davide P. Cervone" <dpvc@union.edu>
Date: Fri, 11 Jun 2021 14:36:10 -0400
Subject: [PATCH 3/3] Put back original handlign or failed rules, so that we
 process any remaining rules (oops).

---
 ts/adaptors/HTMLAdaptor.ts | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/ts/adaptors/HTMLAdaptor.ts b/ts/adaptors/HTMLAdaptor.ts
index f911c66db..c4a20e411 100644
--- a/ts/adaptors/HTMLAdaptor.ts
+++ b/ts/adaptors/HTMLAdaptor.ts
@@ -517,13 +517,12 @@ AbstractDOMAdaptor<N, T, D> implements MinHTMLAdaptor<N, T, D> {
    * @override
    */
   public insertRules(node: N, rules: string[]) {
-    let rule;
-    try {
-      for (rule of rules.reverse()) {
+    for (const rule of rules.reverse()) {
+      try {
         node.sheet.insertRule(rule, 0);
+      } catch (e) {
+        console.warn(`MathJax: can't insert css rule '${rule}': ${e.message}`);
       }
-    } catch (e) {
-      console.warn(`MathJax: can't insert css rule '${rule}': ${e.message}`);
     }
   }