Merge branch 'master' into u/jisong/1994

microsoft · Aug 1, 2023 · b6e4d05 · b6e4d05
2 parents e92cbce + d0a934b
commit b6e4d05
Show file tree

Hide file tree

Showing 11 changed files with 106 additions and 85 deletions.
diff --git a/packages-content-model/roosterjs-content-model-dom/test/endToEndTest.ts b/packages-content-model/roosterjs-content-model-dom/test/endToEndTest.ts
@@ -2,6 +2,7 @@ import * as createGeneralBlock from '../lib/modelApi/creators/createGeneralBlock
 import DarkColorHandlerImpl from 'roosterjs-editor-core/lib/editor/DarkColorHandlerImpl';
 import { contentModelToDom } from '../lib/modelToDom/contentModelToDom';
 import { domToContentModel } from '../lib/domToModel/domToContentModel';
+import { expectHtml } from 'roosterjs-editor-api/test/TestHelper';
 import {
     ContentModelBlockFormat,
     ContentModelDocument,
@@ -46,7 +47,7 @@ describe('End to end test for DOM => Model', () => {
             expectedHTMLFirefox, //firefox
         ];
 
-        expect(possibleHTML.indexOf(div2.innerHTML)).toBeGreaterThanOrEqual(0, div2.innerHTML);
+        expectHtml(div2.innerHTML, possibleHTML);
     }
 
     it('List with margin', () => {

diff --git a/...oosterjs-content-model-dom/test/formatHandlers/common/backgroundColorFormatHandlerTest.ts b/...oosterjs-content-model-dom/test/formatHandlers/common/backgroundColorFormatHandlerTest.ts
@@ -2,6 +2,7 @@ import DarkColorHandlerImpl from 'roosterjs-editor-core/lib/editor/DarkColorHand
 import { backgroundColorFormatHandler } from '../../../lib/formatHandlers/common/backgroundColorFormatHandler';
 import { createDomToModelContext } from '../../../lib/domToModel/context/createDomToModelContext';
 import { createModelToDomContext } from '../../../lib/modelToDom/context/createModelToDomContext';
+import { expectHtml } from 'roosterjs-editor-dom/test/DomTestHelper';
 import {
     BackgroundColorFormat,
     DomToModelContext,
@@ -97,11 +98,11 @@ describe('backgroundColorFormatHandler.apply', () => {
 
         backgroundColorFormatHandler.apply(format, div, context);
 
-        const result = [
+        const expectedResult = [
             '<div style="--darkColor_red:darkMock:red; background-color: var(--darkColor_red, red);"></div>',
             '<div style="--darkColor_red: darkMock:red; background-color: var(--darkColor_red, red);"></div>',
-        ].indexOf(div.outerHTML);
+        ];
 
-        expect(result).toBeGreaterThanOrEqual(0, div.outerHTML);
+        expectHtml(div.outerHTML, expectedResult);
     });
 });
diff --git a/...t-model/roosterjs-content-model-dom/test/formatHandlers/common/borderFormatHandlerTest.ts b/...t-model/roosterjs-content-model-dom/test/formatHandlers/common/borderFormatHandlerTest.ts
@@ -51,7 +51,7 @@ describe('borderFormatHandler.parse', () => {
         });
     });
 
-    it('Has border width none value', () => {
+    itChromeOnly('Has border width none value', () => {
         div.style.borderWidth = '1px 2px 3px 4px';
         div.style.borderStyle = 'none';
         div.style.borderColor = 'red';

diff --git a/...del/roosterjs-content-model-dom/test/formatHandlers/segment/textColorFormatHandlerTest.ts b/...del/roosterjs-content-model-dom/test/formatHandlers/segment/textColorFormatHandlerTest.ts
@@ -1,6 +1,7 @@
 import DarkColorHandlerImpl from 'roosterjs-editor-core/lib/editor/DarkColorHandlerImpl';
 import { createDomToModelContext } from '../../../lib/domToModel/context/createDomToModelContext';
 import { createModelToDomContext } from '../../../lib/modelToDom/context/createModelToDomContext';
+import { expectHtml } from 'roosterjs-editor-dom/test/DomTestHelper';
 import { textColorFormatHandler } from '../../../lib/formatHandlers/segment/textColorFormatHandler';
 import {
     DomToModelContext,
@@ -121,12 +122,12 @@ describe('textColorFormatHandler.apply', () => {
 
         textColorFormatHandler.apply(format, div, context);
 
-        const result = [
+        const expectedResult = [
             '<div style="--darkColor_red:darkMock: red; color: var(--darkColor_red, red);"></div>',
             '<div style="--darkColor_red: darkMock: red; color: var(--darkColor_red, red);"></div>',
-        ].indexOf(div.outerHTML);
+        ];
 
-        expect(result).toBeGreaterThanOrEqual(0, div.outerHTML);
+        expectHtml(div.outerHTML, expectedResult);
     });
 
     it('HyperLink without color', () => {

diff --git a/...-content-model/roosterjs-content-model-dom/test/modelToDom/handlers/handleListItemTest.ts b/...-content-model/roosterjs-content-model-dom/test/modelToDom/handlers/handleListItemTest.ts
@@ -3,6 +3,7 @@ import { createListItem } from '../../../lib/modelApi/creators/createListItem';
 import { createListLevel } from '../../../lib/modelApi/creators/createListLevel';
 import { createModelToDomContext } from '../../../lib/modelToDom/context/createModelToDomContext';
 import { createParagraph } from '../../../lib/modelApi/creators/createParagraph';
+import { expectHtml } from 'roosterjs-editor-dom/test/DomTestHelper';
 import { handleList as originalHandleList } from '../../../lib/modelToDom/handlers/handleList';
 import { handleListItem } from '../../../lib/modelToDom/handlers/handleListItem';
 import { listItemMetadataFormatHandler } from '../../../lib/formatHandlers/list/listItemMetadataFormatHandler';
@@ -249,10 +250,7 @@ describe('handleListItem', () => {
             '<div><ol style="flex-direction: column; display: flex;" start="1"><li style="align-self: center;"></li></ol></div>',
         ];
 
-        expect(expectedResult.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, expectedResult);
         expect(context.listFormat).toEqual({
             threadItemCounts: [1],
             nodeStack: [

diff --git a/...ages-content-model/roosterjs-content-model-dom/test/modelToDom/handlers/handleListTest.ts b/...ages-content-model/roosterjs-content-model-dom/test/modelToDom/handlers/handleListTest.ts
@@ -3,8 +3,8 @@ import { ContentModelListItem, ModelToDomContext } from 'roosterjs-content-model
 import { createListItem } from '../../../lib/modelApi/creators/createListItem';
 import { createListLevel } from '../../../lib/modelApi/creators/createListLevel';
 import { createModelToDomContext } from '../../../lib/modelToDom/context/createModelToDomContext';
+import { expectHtml, itChromeOnly } from 'roosterjs-editor-dom/test/DomTestHelper';
 import { handleList } from '../../../lib/modelToDom/handlers/handleList';
-import { itChromeOnly } from 'roosterjs-editor-dom/test/DomTestHelper';
 
 describe('handleList', () => {
     let context: ModelToDomContext;
@@ -62,10 +62,7 @@ describe('handleList', () => {
             '<div><ol start="1"></ol></div>', //Firefox
         ];
 
-        expect(possibleResults.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, possibleResults);
         expect(context.listFormat).toEqual({
             threadItemCounts: [0],
             nodeStack: [
@@ -277,10 +274,8 @@ describe('handleList', () => {
             '<div><ul><ol></ol></ul><ol start="2"></ol></div>', //Firefox
         ];
 
-        expect(possibleResults.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, possibleResults);
+
         expect(context.listFormat).toEqual({
             threadItemCounts: [1],
             nodeStack: [
@@ -322,10 +317,7 @@ describe('handleList', () => {
             '<div><ul><ol></ol><ol start="3"></ol></ul></div>', //Firefox
         ];
 
-        expect(possibleResults.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, possibleResults);
 
         expect(context.listFormat).toEqual({
             threadItemCounts: [1, 2],
@@ -432,10 +424,8 @@ describe('handleList without format handlers', () => {
             '<div><ol start="1"></ol></div>', //Firefox
         ];
 
-        expect(possibleResults.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, possibleResults);
+
         expect(context.listFormat).toEqual({
             threadItemCounts: [],
             nodeStack: [
@@ -634,10 +624,8 @@ describe('handleList without format handlers', () => {
             '<div><ul><ol></ol></ul><ol start="2"></ol></div>', //Firefox
         ];
 
-        expect(possibleResults.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, possibleResults);
+
         expect(context.listFormat).toEqual({
             threadItemCounts: [1],
             nodeStack: [
@@ -726,11 +714,10 @@ describe('handleList handles metadata', () => {
         const possibleResults = [
             '<ol start="1" data-editing-info="{&quot;orderedStyleType&quot;:9,&quot;unorderedStyleType&quot;:9}" style="list-style-type: upper-alpha;"></ol>', // Chrome
             '<ol style="list-style-type: upper-alpha;" data-editing-info="{&quot;orderedStyleType&quot;:9,&quot;unorderedStyleType&quot;:9}" start="1"></ol>', // Firefox
+            '<ol start="1" style="list-style-type: upper-alpha;" data-editing-info="{&quot;orderedStyleType&quot;:9,&quot;unorderedStyleType&quot;:9}"></ol>', // Firefox 116+
         ];
-        expect(possibleResults.indexOf(parent.innerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.innerHTML
-        );
+
+        expectHtml(parent.innerHTML, possibleResults);
     });
 
     it('OL with metadata with simple value', () => {
@@ -752,12 +739,10 @@ describe('handleList handles metadata', () => {
         const possibleResults = [
             '<ol start="1" data-editing-info="{&quot;orderedStyleType&quot;:5,&quot;unorderedStyleType&quot;:9}" style="list-style-type: lower-alpha;"></ol>', // Chrome
             '<ol style="list-style-type: lower-alpha;" data-editing-info="{&quot;orderedStyleType&quot;:5,&quot;unorderedStyleType&quot;:9}" start="1"></ol>', // Firefox
+            '<ol start="1" style="list-style-type: lower-alpha;" data-editing-info="{&quot;orderedStyleType&quot;:5,&quot;unorderedStyleType&quot;:9}"></ol>', // Firefox 116+
         ];
 
-        expect(possibleResults.indexOf(parent.innerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.innerHTML
-        );
+        expectHtml(parent.innerHTML, possibleResults);
     });
 
     it('UL with metadata with simple value', () => {
@@ -780,10 +765,7 @@ describe('handleList handles metadata', () => {
             '<ul data-editing-info="{&quot;orderedStyleType&quot;:5,&quot;unorderedStyleType&quot;:9}" style="list-style-type: circle;"></ul>', // Chrome
             '<ul style="list-style-type: circle;" data-editing-info="{&quot;orderedStyleType&quot;:5,&quot;unorderedStyleType&quot;:9}"></ul>', // Firefox
         ];
-        expect(possibleResults.indexOf(parent.innerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.innerHTML
-        );
+        expectHtml(parent.innerHTML, possibleResults);
     });
 
     it('OL with refNode', () => {
@@ -796,10 +778,8 @@ describe('handleList handles metadata', () => {
 
         const possibleResults = ['<div><ol start="1"></ol><br></div>'];
 
-        expect(possibleResults.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, possibleResults);
+
         expect(context.listFormat).toEqual({
             threadItemCounts: [0],
             nodeStack: [
@@ -834,10 +814,8 @@ describe('handleList handles metadata', () => {
             '<div><ol><ol start="1"></ol></ol><br></div>', //Firefox
         ];
 
-        expect(possibleResults.indexOf(parent.outerHTML)).toBeGreaterThanOrEqual(
-            0,
-            parent.outerHTML
-        );
+        expectHtml(parent.outerHTML, possibleResults);
+
         expect(context.listFormat).toEqual({
             threadItemCounts: [1, 0],
             nodeStack: [

diff --git a/...osterjs-content-model-editor/test/editor/plugins/paste/processPastedContentFromWacTest.ts b/...osterjs-content-model-editor/test/editor/plugins/paste/processPastedContentFromWacTest.ts
@@ -1311,7 +1311,7 @@ describe('wordOnlineHandler', () => {
         });
 
         describe('Contain Word WAC Image', () => {
-            it('Contain Single WAC Image', () => {
+            itChromeOnly('Contain Single WAC Image', () => {
                 runTest(
                     '<span style="padding: 0px; user-select: text; -webkit-user-drag: none; -webkit-tap-highlight-color: transparent; position: relative; cursor: move; left: 0px; top: 2px; text-indent: 0px; color: rgb(0, 0, 0); font-family: &quot;Segoe UI&quot;, &quot;Segoe UI Web&quot;, Arial, Verdana, sans-serif; font-size: 12px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; width: auto; height: auto; transform: rotate(0deg);" role="presentation" class="WACImageContainer NoPadding DragDrop BlobObject SCXW139784418 BCX8"><img src="http://www.microsoft.com" style="margin: 0px; padding: 0px; user-select: text; -webkit-user-drag: none; -webkit-tap-highlight-color: transparent; border: none; white-space: pre !important; vertical-align: baseline; width: 264px; height: 96px;" alt="Graphical user interface, text, application Description automatically generated" class="WACImage SCXW139784418 BCX8"><span style="margin: 0px; padding: 0px; user-select: text; -webkit-user-drag: none; -webkit-tap-highlight-color: transparent; white-space: pre !important; display: block; position: absolute; transform: rotate(0deg); width: 264px; height: 96px; left: 0px; top: 0px;" class="WACImageBorder SCXW139784418 BCX8"></span></span>',
                     undefined,

diff --git a/...content-model-editor/test/editor/plugins/paste/processPastedContentFromWordDesktopTest.ts b/...content-model-editor/test/editor/plugins/paste/processPastedContentFromWordDesktopTest.ts
@@ -1,15 +1,20 @@
 import ContentModelBeforePasteEvent from '../../../../lib/publicTypes/event/ContentModelBeforePasteEvent';
-import { Browser, moveChildNodes } from 'roosterjs-editor-dom';
 import { ClipboardData, PluginEventType } from 'roosterjs-editor-types';
 import { ContentModelDocument } from 'roosterjs-content-model-types';
 import { contentModelToDom, domToContentModel } from 'roosterjs-content-model-dom';
+import { expectHtml } from 'roosterjs-editor-api/test/TestHelper';
+import { moveChildNodes } from 'roosterjs-editor-dom';
 import { processPastedContentFromWordDesktop } from '../../../../lib/editor/plugins/PastePlugin/WordDesktop/processPastedContentFromWordDesktop';
 
 describe('processPastedContentFromWordDesktopTest', () => {
     let div: HTMLElement;
     let fragment: DocumentFragment;
 
-    function runTest(source?: string, expected?: string, expectedModel?: ContentModelDocument) {
+    function runTest(
+        source?: string,
+        expected?: string | string[],
+        expectedModel?: ContentModelDocument
+    ) {
         //Act
         if (source) {
             div = document.createElement('div');
@@ -40,7 +45,7 @@ describe('processPastedContentFromWordDesktopTest', () => {
 
         //Assert
         if (expected) {
-            expect(div.innerHTML).toBe(expected);
+            expectHtml(div.innerHTML, expected);
         }
         div.parentElement?.removeChild(div);
     }
@@ -853,9 +858,10 @@ describe('processPastedContentFromWordDesktopTest', () => {
                     '</ol>' +
                     '</ol>' +
                     '</ol>',
-                Browser.isFirefox
-                    ? '<ol start="1"><li>123123</li><ol start="1"><li style="list-style-type: lower-alpha;">123123</li><ol style="margin-top: 1em;" start="1"><li style="margin-top: 1em; margin-bottom: 1em; list-style-type: lower-roman;">123123</li><ol start="1"><li style="list-style-type: decimal;">123123123</li></ol></ol></ol></ol>'
-                    : '<ol start="1"><li>123123</li><ol start="1"><li style="list-style-type: lower-alpha;">123123</li><ol start="1" style="margin-top: 1em;"><li style="margin-top: 1em; margin-bottom: 1em; list-style-type: lower-roman;">123123</li><ol start="1"><li style="list-style-type: decimal;">123123123</li></ol></ol></ol></ol>',
+                [
+                    '<ol start="1"><li>123123</li><ol start="1"><li style="list-style-type: lower-alpha;">123123</li><ol style="margin-top: 1em;" start="1"><li style="margin-top: 1em; margin-bottom: 1em; list-style-type: lower-roman;">123123</li><ol start="1"><li style="list-style-type: decimal;">123123123</li></ol></ol></ol></ol>',
+                    '<ol start="1"><li>123123</li><ol start="1"><li style="list-style-type: lower-alpha;">123123</li><ol start="1" style="margin-top: 1em;"><li style="margin-top: 1em; margin-bottom: 1em; list-style-type: lower-roman;">123123</li><ol start="1"><li style="list-style-type: decimal;">123123123</li></ol></ol></ol></ol>',
+                ],
                 {
                     blockGroupType: 'Document',
                     blocks: [
@@ -1164,9 +1170,10 @@ describe('processPastedContentFromWordDesktopTest', () => {
         it('Word doc created online but edited and copied from Desktop', () => {
             runTest(
                 '<p class="MsoNormal"><span style="font-family:Arial,sans-serif">it went:<o:p></o:p></span></p><p class="MsoListParagraphCxSpFirst" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="font-family:Arial,sans-serif;mso-fareast-font-family:Arial"><span style="mso-list:Ignore">1.<span style="font:7pt "Times New Roman"">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></span></span><![endif]><span style="font-family:Arial,sans-serif">Test<o:p></o:p></span></p><p class="MsoListParagraphCxSpLast" style="text-indent:-.25in;mso-list:l0 level1 lfo1"><![if !supportLists]><span style="font-family:Arial,sans-serif;mso-fareast-font-family:Arial"><span style="mso-list:Ignore">2.<span style="font:7pt "Times New Roman"">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></span></span><![endif]><span style="font-family:Arial,sans-serif">Test2<o:p></o:p></span></p>',
-                Browser.isFirefox
-                    ? '<p><span style="font-family: Arial, sans-serif;">it went:</span></p><ol style="margin-top: 1em;" start="1"><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test</span></li><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test2</span></li></ol>'
-                    : '<p><span style="font-family: Arial, sans-serif;">it went:</span></p><ol start="1" style="margin-top: 1em;"><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test</span></li><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test2</span></li></ol>',
+                [
+                    '<p><span style="font-family: Arial, sans-serif;">it went:</span></p><ol style="margin-top: 1em;" start="1"><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test</span></li><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test2</span></li></ol>',
+                    '<p><span style="font-family: Arial, sans-serif;">it went:</span></p><ol start="1" style="margin-top: 1em;"><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test</span></li><li style="margin-top: 1em; margin-bottom: 1em;"><span style="font-family: Arial, sans-serif;">Test2</span></li></ol>',
+                ],
                 {
                     blockGroupType: 'Document',
                     blocks: [