Skip to content

Commit ec7521b

Browse files
kacperzolkiewskikacperzolkiewski
committed
test: add e2e test for colors
1 parent 18ca4bd commit ec7521b

6 files changed

Lines changed: 157 additions & 5 deletions

File tree

‎.maestro/enrichedInput/flows/custom_style_colors_visual.yaml‎

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
appId: swmansion.enriched.example
2+
---
3+
# Validates custom colors on plain text, inline styles, and paragraph styles.
4+
- launchApp
5+
6+
- tapOn:
7+
id: 'toggle-screen-button'
8+
9+
- tapOn:
10+
id: 'editor-input'
11+
12+
# Section 1: Plain text with colors
13+
14+
- tapOn:
15+
id: 'toolbar-text-color'
16+
- tapOn:
17+
id: 'color-swatch-FF0000'
18+
- inputText: 'Red text'
19+
- tapOn:
20+
id: 'toolbar-text-color'
21+
- tapOn:
22+
id: 'color-swatch-clear'
23+
- inputText: ' '
24+
25+
- tapOn:
26+
id: 'toolbar-bg-color'
27+
- tapOn:
28+
id: 'color-swatch-FFFF00'
29+
- inputText: 'Yellow back'
30+
- tapOn:
31+
id: 'toolbar-bg-color'
32+
- tapOn:
33+
id: 'color-swatch-clear'
34+
- inputText: ' '
35+
36+
- tapOn:
37+
id: 'toolbar-text-color'
38+
- tapOn:
39+
id: 'color-swatch-FF0000'
40+
- tapOn:
41+
id: 'toolbar-bg-color'
42+
- tapOn:
43+
id: 'color-swatch-FFFF00'
44+
- inputText: 'Red+Yellow'
45+
- tapOn:
46+
id: 'toolbar-text-color'
47+
- tapOn:
48+
id: 'color-swatch-clear'
49+
- tapOn:
50+
id: 'toolbar-bg-color'
51+
- tapOn:
52+
id: 'color-swatch-clear'
53+
- inputText: ' '
54+
55+
# Section 2: Inline styles + color
56+
57+
- tapOn:
58+
id: 'toolbar-bold'
59+
- tapOn:
60+
id: 'toolbar-text-color'
61+
- tapOn:
62+
id: 'color-swatch-FF0000'
63+
- inputText: 'Bold red'
64+
- tapOn:
65+
id: 'toolbar-bold'
66+
- tapOn:
67+
id: 'toolbar-text-color'
68+
- tapOn:
69+
id: 'color-swatch-clear'
70+
- inputText: ' '
71+
72+
- tapOn:
73+
id: 'toolbar-italic'
74+
- tapOn:
75+
id: 'toolbar-bg-color'
76+
- tapOn:
77+
id: 'color-swatch-FFFF00'
78+
- inputText: 'Italic yellow back'
79+
- tapOn:
80+
id: 'toolbar-italic'
81+
- tapOn:
82+
id: 'toolbar-bg-color'
83+
- tapOn:
84+
id: 'color-swatch-clear'
85+
- inputText: ' '
86+
- pressKey: Enter
87+
88+
# Section 3: Paragraph styles + color
89+
90+
- tapOn:
91+
id: 'toolbar-heading-5'
92+
- tapOn:
93+
id: 'toolbar-text-color'
94+
- tapOn:
95+
id: 'color-swatch-FF0000'
96+
- inputText: 'H5 red'
97+
- pressKey: Enter
98+
- tapOn:
99+
id: 'toolbar-text-color'
100+
- tapOn:
101+
id: 'color-swatch-clear'
102+
103+
- tapOn:
104+
id: 'toolbar-quote'
105+
- tapOn:
106+
id: 'toolbar-bg-color'
107+
- tapOn:
108+
id: 'color-swatch-FFFF00'
109+
- inputText: 'Quote yellow back'
110+
- tapOn:
111+
id: 'toolbar-bg-color'
112+
- tapOn:
113+
id: 'color-swatch-clear'
114+
115+
- runFlow:
116+
file: '../subflows/capture_or_assert_screenshot.yaml'
117+
env:
118+
SCREENSHOT_NAME: 'custom_style_colors'

‎.maestro/enrichedInput/screenshots/ios/custom_style_colors.png‎

40.2 KB
Loading

‎.maestro/enrichedText/flows/custom_style_colors_visual.yaml‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
appId: swmansion.enriched.example
2+
---
3+
# Validates that custom style colors are displayed correctly
4+
- launchApp
5+
6+
- tapOn:
7+
id: 'toggle-screen-button'
8+
9+
- tapOn:
10+
id: 'toggle-enriched-text-screen-button'
11+
12+
- runFlow:
13+
file: '../subflows/set_enriched_text_value.yaml'
14+
env:
15+
VALUE: >
16+
<html>
17+
<p><span style="color: #FF5733;">Standard 6-digit Hex text</span></p>
18+
<p><span style="background-color: #000000; color: #FFFFFF;">White text on black background</span></p>
19+
<p><span style="background-color: #00FF0040;">25% transparent green background</span></p>
20+
<p><span style="color: #0000FF80;">50% transparent blue text</span></p>
21+
<p><span style="color: #F00;">Red 3-digit shorthand text</span></p>
22+
<h6><span style="background-color: #0F0; color: #000;">Black text on green</span></h6>
23+
</html>
24+
25+
- runFlow:
26+
file: '../subflows/capture_or_assert_screenshot.yaml'
27+
env:
28+
SCREENSHOT_NAME: 'custom_style_colors_visual'

‎.maestro/enrichedText/screenshots/ios/custom_style_colors_visual.png‎

56 KB
Loading

‎apps/example/ios/Podfile.lock‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2026,7 +2026,7 @@ EXTERNAL SOURCES:
20262026

20272027
SPEC CHECKSUMS:
20282028
FBLazyVector: c00c20551d40126351a6783c47ce75f5b374851b
2029-
hermes-engine: 484c595d9e6a0b7b7607e8ead508ba5c472493c7
2029+
hermes-engine: b4dad6ba67535bb03c8ff1006b337cba14db16cb
20302030
RCTDeprecation: 3bb167081b134461cfeb875ff7ae1945f8635257
20312031
RCTRequired: 74839f55d5058a133a0bc4569b0afec750957f64
20322032
RCTSwiftUI: 87a316382f3eab4dd13d2a0d0fd2adcce917361a
@@ -2035,7 +2035,7 @@ SPEC CHECKSUMS:
20352035
React: 1b1536b9099195944034e65b1830f463caaa8390
20362036
React-callinvoker: 6dff6d17d1d6cc8fdf85468a649bafed473c65f5
20372037
React-Core: 39ee05b5798296f433dd3c3624c57a187c1510e3
2038-
React-Core-prebuilt: 3ca7a49d919f940e7de8fb0c2a3f5cfcb665f09b
2038+
React-Core-prebuilt: 69556f895326f23c007f3a6869340045d7dca106
20392039
React-CoreModules: e78bfd2617075bc0e50c689df4a29232bd72ad82
20402040
React-cxxreact: 3fe21801d46097cf74c3dff6953677bebc4a3c2a
20412041
React-debug: e1f00fcd2cef58a2897471a6d76a4ef5f5f90c74
@@ -2097,8 +2097,8 @@ SPEC CHECKSUMS:
20972097
ReactAppDependencyProvider: 706b65371b90b5cc797b6639e8979f2e5cecd6da
20982098
ReactCodegen: ab01ebfffac5cda9140204eb872ed97c15df225f
20992099
ReactCommon: 47ef95b0920948a0b54d7439f7452501eeeac071
2100-
ReactNativeDependencies: 652705a9bc92800d0b1e15177a61ba70d89d24dd
2101-
ReactNativeEnrichedHtml: 93722241410f2daaa8c20ce6bcfcf4666bfd9166
2100+
ReactNativeDependencies: 8a208df374583424130645685d86306befc275cf
2101+
ReactNativeEnrichedHtml: 7d90df4aced7f533c7bd15ac296879b214413361
21022102
Yoga: e83c3121d079541e69f3c5c623faaaf933fb5812
21032103

21042104
PODFILE CHECKSUM: 88c10840d02e9884b2dc3f457d5120f83ac3803b

‎apps/example/src/components/ColorPickerRow.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,14 +21,20 @@ export const ColorPickerRow: FC<Props> = ({
2121
style={styles.container}
2222
contentContainerStyle={styles.content}
2323
>
24-
<Pressable style={styles.clearButton} onPress={onClear}>
24+
<Pressable
25+
testID="color-swatch-clear"
26+
style={styles.clearButton}
27+
onPress={onClear}
28+
>
2529
<Text style={styles.clearText}>✕</Text>
2630
</Pressable>
2731
{colors.map((color) => {
2832
const isActive = color.toLowerCase() === activeColor?.toLowerCase();
33+
const swatchId = `color-swatch-${color.replace('#', '').toUpperCase()}`;
2934
return (
3035
<Pressable
3136
key={color}
37+
testID={swatchId}
3238
onPress={() => onSelectColor(color)}
3339
style={[
3440
styles.swatch,

0 commit comments

Comments
 (0)