diff --git a/packages/@react-native-windows/tester/src/js/examples-win/LegacyTests/TextBackgroundColorTestPage.tsx b/packages/@react-native-windows/tester/src/js/examples-win/LegacyTests/TextBackgroundColorTestPage.tsx deleted file mode 100644 index c5642a42c51..00000000000 --- a/packages/@react-native-windows/tester/src/js/examples-win/LegacyTests/TextBackgroundColorTestPage.tsx +++ /dev/null @@ -1,110 +0,0 @@ -/** - * Copyright (c) Microsoft Corporation. - * Licensed under the MIT License. - */ - - import * as React from 'react' - import { - Text, - View, - } from 'react-native'; - - export function TextBackgroundColorTestPage() { - return ( - - - Outer pink - - Outer red nested - - - Outer{' '} - - nested white on blue - - - - Outer pink nested red - - - Outer on green{' '} - nested white on inherit green - - - Outer orange on green{' '} - - nested white on blue - - - - Outer orange{' '} - - nested white on blue - - - - - nested orange inherit on blue - - - - - Outer no_color{' '} - - START_NESTED green{' '} - - DEEPER_NESTED blue - {' '} - END_NESTED - {' '} - attributes. - - - Outer no_color{' '} - - START_NESTED no_color{' '} - DEEPER_NESTED blue{' '} - END_NESTED - {' '} - attributes. - - - Outer no_color{' '} - - START_NESTED green DEEPER_NESTED inherit green{' '} - END_NESTED - {' '} - attributes. - - - Outer red{' '} - - START_NESTED inherit red DEEPER_NESTED inherit red{' '} - END_NESTED - {' '} - attributes. - - - Outer red{' '} - - START_NESTED green{' '} - DEEPER_NESTED blue{' '} - END_NESTED - {' '} - attributes. - - - - ); - } - - export const displayName = (_undefined?: string) => { }; - export const title = 'LegacyTextBackgroundColorTest'; - export const description = 'Legacy e2e test for Text with backgroundColor'; - export const examples = [ - { - render: function (): JSX.Element { - return ; - }, - }, - ]; \ No newline at end of file diff --git a/packages/@react-native-windows/tester/src/js/examples-win/Text/TextExample.windows.tsx b/packages/@react-native-windows/tester/src/js/examples-win/Text/TextExample.windows.tsx index e2897eef700..a8b34d111fa 100644 --- a/packages/@react-native-windows/tester/src/js/examples-win/Text/TextExample.windows.tsx +++ b/packages/@react-native-windows/tester/src/js/examples-win/Text/TextExample.windows.tsx @@ -81,7 +81,7 @@ export class AttributeToggler extends React.Component< export class BackgroundColorDemo extends React.Component<{}> { public render() { return ( - + Outer pink Outer red nested @@ -183,7 +183,7 @@ export class TextExample extends React.Component< return ( - + This text should be uppercased. @@ -256,19 +256,21 @@ export class TextExample extends React.Component< - + The text should wrap if it goes on multiple lines. See, this is going to the next line. {lorumIpsum} - + This text is indented by 10px padding on all sides. Sans-Serif - + Sans-Serif Bold Serif @@ -365,11 +367,15 @@ export class TextExample extends React.Component< - Size 23 + + Size 23 + Size 8 - Red color + + Red color + Blue color @@ -386,13 +392,18 @@ export class TextExample extends React.Component< - Solid underline + + Solid underline + None textDecoration + }} + testID={'text-decoration-solid-linethru'}> Solid line-through @@ -408,7 +419,7 @@ export class TextExample extends React.Component< - console.log('1st')}> + console.log('1st')} testID={'text-outer-color'}> (Normal text, (R)red @@ -488,23 +499,25 @@ export class TextExample extends React.Component< - auto (default) - english LTR - أحب اللغة العربية auto (default) - arabic RTL - - left left left left left left left left left left left left left - left left - - - center center center center center center center center center - center center - - - right right right right right right right right right right right - right right - + + auto (default) - english LTR + أحب اللغة العربية auto (default) - arabic RTL + + left left left left left left left left left left left left left + left left + + + center center center center center center center center center + center center + + + right right right right right right right right right right right + right right + + - + 星际争霸是世界上最好的游戏。 @@ -533,19 +546,21 @@ export class TextExample extends React.Component< - - Holisticly formulate inexpensive ideas before best-of-breed - benefits. Continually expedite - magnetic potentialities rather than client-focused interfaces. - - - Holisticly formulate inexpensive ideas before best-of-breed - benefits. Continually expedite - magnetic potentialities rather than client-focused interfaces. - + + + Holisticly formulate inexpensive ideas before best-of-breed + benefits. Continually expedite + magnetic potentialities rather than client-focused interfaces. + + + Holisticly formulate inexpensive ideas before best-of-breed + benefits. Continually expedite + magnetic potentialities rather than client-focused interfaces. + + - + letterSpacing = 0 letterSpacing = 2 @@ -638,7 +653,7 @@ export class TextExample extends React.Component< 1 - + Maximum of one line no matter now much I write here. If I keep writing it{"'"}ll just truncate after one line. {lorumIpsum} @@ -658,13 +673,16 @@ export class TextExample extends React.Component< - + This text is selectable if you click-and-hold, and will offer the native Android selection menus. - + This text will have a orange highlight on selection. @@ -683,36 +701,39 @@ export class TextExample extends React.Component< textShadowOffset: {width: 2, height: 2}, textShadowRadius: 1, textShadowColor: '#00cccc', - }}> + }} + testID={'text-shadow'}> Demo text shadow - - (default) tail - - - This very long text should be truncated with dots in the end.{' '} - {lorumIpsum} - + + + (default) tail + + + This very long text should be truncated with dots in the end.{' '} + {lorumIpsum} + - middle - - This very long text should be truncated with dots in the middle.{' '} - {lorumIpsum} - + middle + + This very long text should be truncated with dots in the middle.{' '} + {lorumIpsum} + - head - - This very long text should be truncated with dots in the beginning.{' '} - {lorumIpsum} - + head + + This very long text should be truncated with dots in the + beginning. {lorumIpsum} + - clip - - This very long text should be clipped and this will not be visible.{' '} - {lorumIpsum} - + clip + + This very long text should be clipped and this will not be + visible. {lorumIpsum} + + + }} + testID={'text-font-padding'}> Ey Default @@ -744,7 +766,7 @@ export class TextExample extends React.Component< - <> + Sample bordered text with default styling. @@ -768,7 +790,7 @@ export class TextExample extends React.Component< and laid out within the normal text run, so will wrap etc as normal text. - + ); diff --git a/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js b/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js index 049425dff6b..1556e96c3e0 100644 --- a/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js +++ b/packages/@react-native-windows/tester/src/js/utils/RNTesterList.windows.js @@ -199,10 +199,6 @@ const ComponentExamples: Array = [ key: 'LegacyImageTest', module: require('../examples-win/LegacyTests/ImageTestPage'), }, - { - key: 'LegacyTextBackgroundColorTest', - module: require('../examples-win/LegacyTests/TextBackgroundColorTestPage'), - }, ]; const APIExamples: Array = [ diff --git a/packages/e2e-test-app/test/LegacyTextBackgroundColorTest.test.ts b/packages/e2e-test-app/test/LegacyTextBackgroundColorTest.test.ts deleted file mode 100644 index d2f0f22a92b..00000000000 --- a/packages/e2e-test-app/test/LegacyTextBackgroundColorTest.test.ts +++ /dev/null @@ -1,22 +0,0 @@ -/** - * Copyright (c) Microsoft Corporation. - * Licensed under the MIT License. - * - * @format - */ - -import {goToComponentExample, dumpVisualTree} from './framework'; - -beforeAll(async () => { - await goToComponentExample('LegacyTextBackgroundColorTest'); -}); - -describe('LegacyTextBackgroundColorTest', () => { - /* Test case #1: view and image displayed with no border and cornerRadius */ - test('TextBackgroundColorTest', async () => { - const dump = await dumpVisualTree('text-color-background-view', { - additionalProperties: ['TextHighlighters'], - }); - expect(dump).toMatchSnapshot(); - }); -}); diff --git a/packages/e2e-test-app/test/TextComponentTest.test.ts b/packages/e2e-test-app/test/TextComponentTest.test.ts new file mode 100644 index 00000000000..d68a58ab32c --- /dev/null +++ b/packages/e2e-test-app/test/TextComponentTest.test.ts @@ -0,0 +1,121 @@ +/** + * Copyright (c) Microsoft Corporation. + * Licensed under the MIT License. + * + * @format + */ + +import {goToComponentExample, dumpVisualTree} from './framework'; + +beforeAll(async () => { + await goToComponentExample('Text'); +}); + +describe('TextTest', () => { + test('Text transform', async () => { + const dump = await dumpVisualTree('text-transform'); + expect(dump).toMatchSnapshot(); + }); + + test('Text wrapping', async () => { + const dump = await dumpVisualTree('text-wrap'); + expect(dump).toMatchSnapshot(); + }); + + test('Text padding', async () => { + const dump = await dumpVisualTree('text-padding'); + expect(dump).toMatchSnapshot(); + }); + + test('Text font family', async () => { + const dump = await dumpVisualTree('text-font-family'); + expect(dump).toMatchSnapshot(); + }); + + test('Text size', async () => { + const dump = await dumpVisualTree('text-size'); + expect(dump).toMatchSnapshot(); + }); + + test('Text color', async () => { + const dump = await dumpVisualTree('text-color'); + expect(dump).toMatchSnapshot(); + }); + + test('Text decoration underline', async () => { + const dump = await dumpVisualTree('text-decoration-underline'); + expect(dump).toMatchSnapshot(); + }); + + test('Text decoration solid linethrough', async () => { + const dump = await dumpVisualTree('text-decoration-solid-linethru'); + expect(dump).toMatchSnapshot(); + }); + + test('Text color with children', async () => { + const dump = await dumpVisualTree('text-outer-color'); + expect(dump).toMatchSnapshot(); + }); + + test('Text alignment', async () => { + const dump = await dumpVisualTree('text-align'); + expect(dump).toMatchSnapshot(); + }); + + test('Text unicode characters', async () => { + const dump = await dumpVisualTree('text-unicode'); + expect(dump).toMatchSnapshot(); + }); + + test('Text line height', async () => { + const dump = await dumpVisualTree('text-line-height'); + expect(dump).toMatchSnapshot(); + }); + + test('Text letter spacing', async () => { + const dump = await dumpVisualTree('text-letter-spacing'); + expect(dump).toMatchSnapshot(); + }); + + test('Text force one line', async () => { + const dump = await dumpVisualTree('text-one-line'); + expect(dump).toMatchSnapshot(); + }); + + test('Text is selectable', async () => { + const dump = await dumpVisualTree('text-selectable'); + expect(dump).toMatchSnapshot(); + }); + + test('Text selection color', async () => { + const dump = await dumpVisualTree('text-selection-color'); + expect(dump).toMatchSnapshot(); + }); + + test('Text shadows', async () => { + const dump = await dumpVisualTree('text-shadow'); + expect(dump).toMatchSnapshot(); + }); + + test('Text ellipsize', async () => { + const dump = await dumpVisualTree('text-ellipsize'); + expect(dump).toMatchSnapshot(); + }); + + test('Text font padding', async () => { + const dump = await dumpVisualTree('text-font-padding'); + expect(dump).toMatchSnapshot(); + }); + + test('Text border', async () => { + const dump = await dumpVisualTree('text-border'); + expect(dump).toMatchSnapshot(); + }); + + test('Text background color', async () => { + const dump = await dumpVisualTree('text-background-color', { + additionalProperties: ['TextHighlighters'], + }); + expect(dump).toMatchSnapshot(); + }); +}); diff --git a/packages/e2e-test-app/test/__snapshots__/LegacyTextBackgroundColorTest.test.ts.snap b/packages/e2e-test-app/test/__snapshots__/LegacyTextBackgroundColorTest.test.ts.snap deleted file mode 100644 index 815851ce337..00000000000 --- a/packages/e2e-test-app/test/__snapshots__/LegacyTextBackgroundColorTest.test.ts.snap +++ /dev/null @@ -1,615 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`LegacyTextBackgroundColorTest TextBackgroundColorTest 1`] = ` -Object { - "AutomationId": "text-color-background-view", - "Background": null, - "BorderBrush": "#00000000", - "BorderThickness": "0,0,0,0", - "Clip": null, - "CornerRadius": "0,0,0,0", - "FlowDirection": "LeftToRight", - "Height": 247, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Top": 0, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Microsoft.ReactNative.ViewPanel", - "children": Array [ - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FFFFC0CB", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer pink", - "TextHighlighters": Array [], - "Top": 0, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer red nested", - "TextHighlighters": Array [], - "Top": 19, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer nested white on blue", - "TextHighlighters": Array [ - Object { - "Background": "#FF0000FF", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 20, - "StartIndex": 6, - }, - ], - }, - ], - "Top": 38, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FFFFC0CB", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer pink nested red", - "TextHighlighters": Array [], - "Top": 57, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer on green nested white on inherit green", - "TextHighlighters": Array [ - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 14, - "StartIndex": 0, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 14, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 29, - "StartIndex": 15, - }, - ], - }, - ], - "Top": 76, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FFFFA500", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer orange on green nested white on blue", - "TextHighlighters": Array [ - Object { - "Background": "#FF008000", - "Foreground": "#FFFFA500", - "Ranges": Array [ - Object { - "Length": 21, - "StartIndex": 0, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": "#FFFFA500", - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 21, - }, - ], - }, - Object { - "Background": "#FF0000FF", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 20, - "StartIndex": 22, - }, - ], - }, - ], - "Top": 95, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FFFFA500", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer orange nested white on blue", - "TextHighlighters": Array [ - Object { - "Background": "#FF0000FF", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 20, - "StartIndex": 13, - }, - ], - }, - ], - "Top": 114, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FFFFA500", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "nested orange inherit on blue", - "TextHighlighters": Array [ - Object { - "Background": "#FF0000FF", - "Foreground": "#FFFFA500", - "Ranges": Array [ - Object { - "Length": 29, - "StartIndex": 0, - }, - ], - }, - ], - "Top": 133, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer no_color START_NESTED green DEEPER_NESTED blue END_NESTED attributes.", - "TextHighlighters": Array [ - Object { - "Background": "#FF008000", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 18, - "StartIndex": 15, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 33, - }, - ], - }, - Object { - "Background": "#FF0000FF", - "Foreground": "#FFFF00FF", - "Ranges": Array [ - Object { - "Length": 18, - "StartIndex": 34, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 52, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": "#FFFFFFFF", - "Ranges": Array [ - Object { - "Length": 10, - "StartIndex": 53, - }, - ], - }, - ], - "Top": 152, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer no_color START_NESTED no_color DEEPER_NESTED blue END_NESTED attributes.", - "TextHighlighters": Array [ - Object { - "Background": "#FF0000FF", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 18, - "StartIndex": 37, - }, - ], - }, - ], - "Top": 171, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer no_color START_NESTED green DEEPER_NESTED inherit green END_NESTED attributes.", - "TextHighlighters": Array [ - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 19, - "StartIndex": 15, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 27, - "StartIndex": 34, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 61, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 10, - "StartIndex": 62, - }, - ], - }, - ], - "Top": 190, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer red START_NESTED inherit red DEEPER_NESTED inherit red END_NESTED attributes.", - "TextHighlighters": Array [ - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 9, - "StartIndex": 0, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 9, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 25, - "StartIndex": 10, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 25, - "StartIndex": 35, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 60, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 10, - "StartIndex": 61, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 71, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 11, - "StartIndex": 72, - }, - ], - }, - ], - "Top": 209, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - Object { - "Clip": null, - "FlowDirection": "LeftToRight", - "Foreground": "#FF000000", - "Height": 19, - "HorizontalAlignment": "Stretch", - "Left": 0, - "Margin": "0,0,0,0", - "Padding": "0,0,0,0", - "Text": "Outer red START_NESTED green DEEPER_NESTED blue END_NESTED attributes.", - "TextHighlighters": Array [ - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 9, - "StartIndex": 0, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 9, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 18, - "StartIndex": 10, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 28, - }, - ], - }, - Object { - "Background": "#FF0000FF", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 18, - "StartIndex": 29, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 47, - }, - ], - }, - Object { - "Background": "#FF008000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 10, - "StartIndex": 48, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 1, - "StartIndex": 58, - }, - ], - }, - Object { - "Background": "#FFFF0000", - "Foreground": null, - "Ranges": Array [ - Object { - "Length": 11, - "StartIndex": 59, - }, - ], - }, - ], - "Top": 228, - "VerticalAlignment": "Stretch", - "Visibility": "Visible", - "Width": 800, - "XamlType": "Windows.UI.Xaml.Controls.TextBlock", - }, - ], -} -`; diff --git a/packages/e2e-test-app/test/__snapshots__/TextComponentTest.test.ts.snap b/packages/e2e-test-app/test/__snapshots__/TextComponentTest.test.ts.snap new file mode 100644 index 00000000000..6a2673fad46 --- /dev/null +++ b/packages/e2e-test-app/test/__snapshots__/TextComponentTest.test.ts.snap @@ -0,0 +1,1991 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`TextTest Text alignment 1`] = ` +Object { + "AutomationId": "text-align", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 95, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "auto (default) - english LTR", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "أحب اللغة العربية auto (default) - arabic RTL", + "Top": 19, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "left left left left left left left left left left left left left left left", + "Top": 38, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "center center center center center center center center center center center", + "Top": 57, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "right right right right right right right right right right right right right", + "Top": 76, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], +} +`; + +exports[`TextTest Text background color 1`] = ` +Object { + "AutomationId": "text-background-color", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 247, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FFFFC0CB", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer pink", + "TextHighlighters": Array [], + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer red nested", + "TextHighlighters": Array [], + "Top": 19, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer nested white on blue", + "TextHighlighters": Array [ + Object { + "Background": "#FF0000FF", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 20, + "StartIndex": 6, + }, + ], + }, + ], + "Top": 38, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FFFFC0CB", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer pink nested red", + "TextHighlighters": Array [], + "Top": 57, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer on green nested white on inherit green", + "TextHighlighters": Array [ + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 14, + "StartIndex": 0, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 14, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 29, + "StartIndex": 15, + }, + ], + }, + ], + "Top": 76, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FFFFA500", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer orange on green nested white on blue", + "TextHighlighters": Array [ + Object { + "Background": "#FF008000", + "Foreground": "#FFFFA500", + "Ranges": Array [ + Object { + "Length": 21, + "StartIndex": 0, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": "#FFFFA500", + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 21, + }, + ], + }, + Object { + "Background": "#FF0000FF", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 20, + "StartIndex": 22, + }, + ], + }, + ], + "Top": 95, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FFFFA500", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer orange nested white on blue", + "TextHighlighters": Array [ + Object { + "Background": "#FF0000FF", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 20, + "StartIndex": 13, + }, + ], + }, + ], + "Top": 114, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FFFFA500", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "nested orange inherit on blue", + "TextHighlighters": Array [ + Object { + "Background": "#FF0000FF", + "Foreground": "#FFFFA500", + "Ranges": Array [ + Object { + "Length": 29, + "StartIndex": 0, + }, + ], + }, + ], + "Top": 133, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer no_color START_NESTED green DEEPER_NESTED magenta on blue END_NESTED attributes.", + "TextHighlighters": Array [ + Object { + "Background": "#FF008000", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 18, + "StartIndex": 15, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 33, + }, + ], + }, + Object { + "Background": "#FF0000FF", + "Foreground": "#FFFF00FF", + "Ranges": Array [ + Object { + "Length": 29, + "StartIndex": 34, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 63, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": "#FFFFFFFF", + "Ranges": Array [ + Object { + "Length": 10, + "StartIndex": 64, + }, + ], + }, + ], + "Top": 152, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer no_color START_NESTED no_color DEEPER_NESTED blue END_NESTED attributes.", + "TextHighlighters": Array [ + Object { + "Background": "#FF0000FF", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 18, + "StartIndex": 37, + }, + ], + }, + ], + "Top": 171, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer no_color START_NESTED green DEEPER_NESTED inherit green END_NESTED attributes.", + "TextHighlighters": Array [ + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 19, + "StartIndex": 15, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 27, + "StartIndex": 34, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 61, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 10, + "StartIndex": 62, + }, + ], + }, + ], + "Top": 190, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer red START_NESTED inherit red DEEPER_NESTED inherit red END_NESTED attributes.", + "TextHighlighters": Array [ + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 9, + "StartIndex": 0, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 9, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 25, + "StartIndex": 10, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 25, + "StartIndex": 35, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 60, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 10, + "StartIndex": 61, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 71, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 11, + "StartIndex": 72, + }, + ], + }, + ], + "Top": 209, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Outer red START_NESTED green DEEPER_NESTED blue END_NESTED attributes.", + "TextHighlighters": Array [ + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 9, + "StartIndex": 0, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 9, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 18, + "StartIndex": 10, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 28, + }, + ], + }, + Object { + "Background": "#FF0000FF", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 18, + "StartIndex": 29, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 47, + }, + ], + }, + Object { + "Background": "#FF008000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 10, + "StartIndex": 48, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 1, + "StartIndex": 58, + }, + ], + }, + Object { + "Background": "#FFFF0000", + "Foreground": null, + "Ranges": Array [ + Object { + "Length": 11, + "StartIndex": 59, + }, + ], + }, + ], + "Top": 228, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], +} +`; + +exports[`TextTest Text border 1`] = ` +Object { + "AutomationId": "text-border", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 395, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Background": null, + "BorderBrush": "#FF000000", + "BorderThickness": "2,2,2,2", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 32, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 400, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 28, + "HorizontalAlignment": "Stretch", + "Left": 2, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Sample bordered text with default styling.", + "Top": 2, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 400, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Background": null, + "BorderBrush": "#FF000000", + "BorderThickness": "2,2,2,2", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "XamlType": "Windows.UI.Xaml.Controls.Border", + }, + ], + }, + Object { + "Background": null, + "BorderBrush": "#FF008000", + "BorderThickness": "3,3,3,3", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 144, + "HorizontalAlignment": "Stretch", + "Left": 100, + "Margin": "0,0,0,0", + "Top": 132, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 518, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 78, + "HorizontalAlignment": "Stretch", + "Left": 33, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Some more bordered text + a tad of CSS. +1st nested - border specifcied but ignored. +2nd Inside text!", + "Top": 33, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 452, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Background": null, + "BorderBrush": "#FF008000", + "BorderThickness": "3,3,3,3", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "XamlType": "Windows.UI.Xaml.Controls.Border", + }, + ], + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This text is outlined and laid out within the normal text run, so will wrap etc as normal text.", + "Top": 376, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], +} +`; + +exports[`TextTest Text color 1`] = ` +Object { + "AutomationId": "text-color", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FFFF0000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Red color", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text color with children 1`] = ` +Object { + "AutomationId": "text-outer-color", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 38, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "(Normal text,(R)red(G)green(B)blue(C)cyan(M)magenta(Y)yellow(K)black(and bold(and tiny bold italic blue(and tiny normal blue))))", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text decoration solid linethrough 1`] = ` +Object { + "AutomationId": "text-decoration-solid-linethru", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Solid line-through", + "Top": 48, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text decoration underline 1`] = ` +Object { + "AutomationId": "text-decoration-underline", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Solid underline", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text ellipsize 1`] = ` +Object { + "AutomationId": "text-ellipsize", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 212, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "(default) tail", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This very long text should be truncated with dots in the end. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", + "Top": 19, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "middle", + "Top": 58, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This very long text should be truncated with dots in the middle. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", + "Top": 77, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "head", + "Top": 116, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This very long text should be truncated with dots in the beginning. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", + "Top": 135, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "clip", + "Top": 174, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This very long text should be clipped and this will not be visible. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", + "Top": 193, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], +} +`; + +exports[`TextTest Text font family 1`] = ` +Object { + "AutomationId": "text-font-family", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 17, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Sans-Serif Bold", + "Top": 27, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text font padding 1`] = ` +Object { + "AutomationId": "text-font-padding", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 163, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 163, + "HorizontalAlignment": "Stretch", + "Left": 110, + "Margin": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 119, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 144, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Ey", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 119, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 37, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Default", + "Top": 144, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 45, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + Object { + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 163, + "HorizontalAlignment": "Stretch", + "Left": 450, + "Margin": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 158, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 144, + "HorizontalAlignment": "Stretch", + "Left": 24, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Ey", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 119, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "includeFontPadding: false", + "Top": 144, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 158, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + ], +} +`; + +exports[`TextTest Text force one line 1`] = ` +Object { + "AutomationId": "text-one-line", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Maximum of one line no matter now much I write here. If I keep writing it'll just truncate after one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", + "Top": 29, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text is selectable 1`] = ` +Object { + "AutomationId": "text-selectable", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This text is selectable if you click-and-hold, and will offer the native Android selection menus.", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text letter spacing 1`] = ` +Object { + "AutomationId": "text-letter-spacing", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 136, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "letterSpacing = 0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "letterSpacing = 2", + "Top": 24, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "letterSpacing = 9", + "Top": 48, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 21, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Top": 67, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 16, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "With size and background color", + "Top": 5, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 169, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "letterSpacing = -1", + "Top": 93, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "[letterSpacing = 3][Nested letterSpacing = 0][Nested letterSpacing = 6]", + "Top": 117, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], +} +`; + +exports[`TextTest Text line height 1`] = ` +Object { + "AutomationId": "text-line-height", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 100, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 70, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Holisticly formulate inexpensive ideas before best-of-breed benefits. Continually expedite magnetic potentialities rather than client-focused interfaces.", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 30, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Holisticly formulate inexpensive ideas before best-of-breed benefits. Continually expedite magnetic potentialities rather than client-focused interfaces.", + "Top": 70, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], +} +`; + +exports[`TextTest Text padding 1`] = ` +Object { + "AutomationId": "text-padding", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 39, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "10,10,10,10", + "Text": "This text is indented by 10px padding on all sides.", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text selection color 1`] = ` +Object { + "AutomationId": "text-selection-color", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This text will have a orange highlight on selection.", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text shadows 1`] = ` +Object { + "AutomationId": "text-shadow", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 27, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Demo text shadow", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text size 1`] = ` +Object { + "AutomationId": "text-size", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 31, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Size 23", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`; + +exports[`TextTest Text transform 1`] = ` +Object { + "AutomationId": "text-transform", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 209, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "THIS TEXT SHOULD BE UPPERCASED.", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "this text should be lowercased.", + "Top": 19, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "This Text Should Be CAPITALIZED.", + "Top": 38, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Mixed: UPPERCASE lowercase Capitalize Each Word", + "Top": 57, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Should be \\"ABC\\":ABC", + "Top": 76, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Should be \\"XyZ\\":XyZ", + "Top": 95, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Should be \\"xYz\\":xYz", + "Top": 114, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Click to toggle uppercase: Hello", + "Top": 133, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Click to change raw text: HELLO WORLD", + "Top": 152, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Background": null, + "BorderBrush": null, + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 38, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Top": 171, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewControl", + "children": Array [ + Object { + "Background": null, + "BorderBrush": null, + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "XamlType": "Windows.UI.Xaml.Controls.ContentPresenter", + "children": Array [ + Object { + "Background": "#00FFFFFF", + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 38, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "Click to toggle fast text on next line (should remain uppercase):", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "HOWDY", + "Top": 19, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + ], + }, + ], + }, + ], +} +`; + +exports[`TextTest Text unicode characters 1`] = ` +Object { + "AutomationId": "text-unicode", + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 95, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "星际争霸是世界上最好的游戏。", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 192, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + Object { + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Top": 19, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "星际争霸是世界上最好的游戏。", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + Object { + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Top": 38, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 19, + "HorizontalAlignment": "Stretch", + "Left": 263, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "星际争霸是世界上最好的游戏。", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 192, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + Object { + "Background": null, + "BorderBrush": "#00000000", + "BorderThickness": "0,0,0,0", + "Clip": null, + "CornerRadius": "0,0,0,0", + "FlowDirection": "LeftToRight", + "Height": 38, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Top": 57, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Microsoft.ReactNative.ViewPanel", + "children": Array [ + Object { + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 38, + "HorizontalAlignment": "Stretch", + "Left": 0, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "星际争霸是世界上最好的游戏。星际争霸是世界上最好的游戏。星际争霸是世界上最好的游戏。星际争霸是世界上最好的游戏。", + "Top": 0, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", + }, + ], + }, + ], +} +`; + +exports[`TextTest Text wrapping 1`] = ` +Object { + "AutomationId": "text-wrap", + "Clip": null, + "FlowDirection": "LeftToRight", + "Foreground": "#FF000000", + "Height": 187, + "HorizontalAlignment": "Stretch", + "Left": 10, + "Margin": "0,0,0,0", + "Padding": "0,0,0,0", + "Text": "The text should wrap if it goes on multiple lines. See, this is going to the next line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus felis eget augue condimentum suscipit. Suspendisse hendrerit, libero aliquet malesuada tempor, urna nibh consectetur tellus, vitae efficitur quam erat non mi. Maecenas vitae eros sit amet quam vestibulum porta sed sit amet tellus. Fusce quis lectus congue, fringilla arcu id, luctus urna. Cras sagittis ornare mauris sit amet dictum. Vestibulum feugiat laoreet fringilla. Vivamus ac diam vehicula felis venenatis sagittis vitae ultrices elit. Curabitur libero augue, laoreet quis orci vitae, congue euismod massa. Aenean nec odio sed urna vehicula fermentum non a magna. Quisque ut commodo neque, eget eleifend odio. Sed sit amet lacinia sem. Suspendisse in metus in purus scelerisque vestibulum. Nam metus dui, efficitur nec metus non, tincidunt pharetra sapien. Praesent id convallis metus, ut malesuada arcu. Quisque quam libero, pharetra eu tellus ac, aliquam fringilla erat. Quisque tempus in lorem ac suscipit.", + "Top": 10, + "VerticalAlignment": "Stretch", + "Visibility": "Visible", + "Width": 718, + "XamlType": "Windows.UI.Xaml.Controls.TextBlock", +} +`;