@symbiote-native/angular 0.6.0 → 0.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/babel-register-composed.cjs +11 -3
- package/build/angular/anchor-host-registry.d.ts +2 -0
- package/build/angular/anchor-host-registry.js +84 -0
- package/build/angular/anchor-host-registry.js.map +1 -0
- package/build/angular/components/input-accessory-view/index.d.ts +2 -1
- package/build/angular/components/input-accessory-view/index.js +28 -39
- package/build/angular/components/input-accessory-view/index.js.map +1 -1
- package/build/angular/components/scroll-view/projection.js +70 -48
- package/build/angular/components/scroll-view/projection.js.map +1 -1
- package/build/angular/components/scroll-view/shared.js +28 -25
- package/build/angular/components/scroll-view/shared.js.map +1 -1
- package/build/angular/components/scroll-view/sticky-header.d.ts +6 -7
- package/build/angular/components/scroll-view/sticky-header.js +82 -65
- package/build/angular/components/scroll-view/sticky-header.js.map +1 -1
- package/build/angular/components/touchable/index.d.ts +2 -5
- package/build/angular/components/touchable/index.js +36 -56
- package/build/angular/components/touchable/index.js.map +1 -1
- package/build/angular/components/virtualized-list/index.d.ts +5 -20
- package/build/angular/components/virtualized-list/index.js +145 -275
- package/build/angular/components/virtualized-list/index.js.map +1 -1
- package/build/angular/components/virtualized-section-list/index.js +2 -4
- package/build/angular/components/virtualized-section-list/index.js.map +1 -1
- package/build/angular/index.d.ts +2 -1
- package/build/angular/index.js +6 -1
- package/build/angular/index.js.map +1 -1
- package/build/angular/renderer/index.d.ts +0 -1
- package/build/angular/renderer/index.js +5 -60
- package/build/angular/renderer/index.js.map +1 -1
- package/package.json +8 -4
- package/src/anchor-host-registry.ts +88 -0
- package/src/components/input-accessory-view/index.ts +30 -39
- package/src/components/scroll-view/projection.ts +76 -46
- package/src/components/scroll-view/shared.ts +27 -19
- package/src/components/scroll-view/sticky-header.ts +89 -64
- package/src/components/touchable/index.ts +52 -66
- package/src/components/virtualized-list/index.ts +157 -368
- package/src/components/virtualized-section-list/index.ts +6 -3
- package/src/index.ts +6 -1
- package/src/renderer/index.ts +5 -63
- package/build/bootstrap.d.ts +0 -7
- package/build/bootstrap.js +0 -14
- package/build/components/activity-indicator/index.android.d.ts +0 -9
- package/build/components/activity-indicator/index.android.js +0 -64
- package/build/components/activity-indicator/index.d.ts +0 -1
- package/build/components/activity-indicator/index.ios.d.ts +0 -5
- package/build/components/activity-indicator/index.ios.js +0 -64
- package/build/components/activity-indicator/index.js +0 -3
- package/build/components/activity-indicator/shared.d.ts +0 -64
- package/build/components/activity-indicator/shared.js +0 -424
- package/build/components/button.d.ts +0 -60
- package/build/components/button.js +0 -456
- package/build/components/flat-list/index.d.ts +0 -119
- package/build/components/flat-list/index.js +0 -691
- package/build/components/image/index.android.d.ts +0 -7
- package/build/components/image/index.android.js +0 -88
- package/build/components/image/index.d.ts +0 -1
- package/build/components/image/index.ios.d.ts +0 -7
- package/build/components/image/index.ios.js +0 -88
- package/build/components/image/index.js +0 -2
- package/build/components/image/shared.d.ts +0 -101
- package/build/components/image/shared.js +0 -405
- package/build/components/image-background.d.ts +0 -78
- package/build/components/image-background.js +0 -583
- package/build/components/input-accessory-view/index.d.ts +0 -56
- package/build/components/input-accessory-view/index.js +0 -403
- package/build/components/keyboard-avoiding-view/index.d.ts +0 -79
- package/build/components/keyboard-avoiding-view/index.js +0 -504
- package/build/components/modal/index.d.ts +0 -89
- package/build/components/modal/index.js +0 -529
- package/build/components/pressable/index.d.ts +0 -120
- package/build/components/pressable/index.js +0 -639
- package/build/components/refresh-control/index.d.ts +0 -83
- package/build/components/refresh-control/index.js +0 -509
- package/build/components/safe-area-view/index.d.ts +0 -54
- package/build/components/safe-area-view/index.js +0 -388
- package/build/components/scroll-view/index.android.d.ts +0 -16
- package/build/components/scroll-view/index.android.js +0 -228
- package/build/components/scroll-view/index.d.ts +0 -3
- package/build/components/scroll-view/index.ios.d.ts +0 -6
- package/build/components/scroll-view/index.ios.js +0 -113
- package/build/components/scroll-view/index.js +0 -5
- package/build/components/scroll-view/projection.d.ts +0 -32
- package/build/components/scroll-view/projection.js +0 -311
- package/build/components/scroll-view/shared.d.ts +0 -225
- package/build/components/scroll-view/shared.js +0 -757
- package/build/components/scroll-view/sticky-header.d.ts +0 -38
- package/build/components/scroll-view/sticky-header.js +0 -257
- package/build/components/section-list/index.d.ts +0 -113
- package/build/components/section-list/index.js +0 -768
- package/build/components/switch/index.android.d.ts +0 -17
- package/build/components/switch/index.android.js +0 -107
- package/build/components/switch/index.d.ts +0 -1
- package/build/components/switch/index.ios.d.ts +0 -16
- package/build/components/switch/index.ios.js +0 -106
- package/build/components/switch/index.js +0 -3
- package/build/components/switch/shared.d.ts +0 -37
- package/build/components/switch/shared.js +0 -176
- package/build/components/text-input.d.ts +0 -150
- package/build/components/text-input.js +0 -821
- package/build/components/touchable/index.d.ts +0 -241
- package/build/components/touchable/index.js +0 -1672
- package/build/components/touchable-native-feedback/index.d.ts +0 -80
- package/build/components/touchable-native-feedback/index.js +0 -545
- package/build/components/virtualized-list/directives.d.ts +0 -41
- package/build/components/virtualized-list/directives.js +0 -249
- package/build/components/virtualized-list/index.d.ts +0 -265
- package/build/components/virtualized-list/index.js +0 -1343
- package/build/components/virtualized-section-list/directives.d.ts +0 -28
- package/build/components/virtualized-section-list/directives.js +0 -148
- package/build/components/virtualized-section-list/index.d.ts +0 -175
- package/build/components/virtualized-section-list/index.js +0 -854
- package/build/components.d.ts +0 -39
- package/build/components.js +0 -37
- package/build/create-portal/index.d.ts +0 -17
- package/build/create-portal/index.js +0 -128
- package/build/create-tunnel/index.d.ts +0 -29
- package/build/create-tunnel/index.js +0 -181
- package/build/descriptor-to-angular/index.d.ts +0 -19
- package/build/descriptor-to-angular/index.js +0 -186
- package/build/host-instance/index.d.ts +0 -2
- package/build/host-instance/index.js +0 -36
- package/build/index.d.ts +0 -21
- package/build/index.js +0 -40
- package/build/modules/animated/animated-leaf-binder/index.d.ts +0 -14
- package/build/modules/animated/animated-leaf-binder/index.js +0 -90
- package/build/modules/animated/animated-leaf-binder.d.ts +0 -14
- package/build/modules/animated/animated-leaf-binder.js +0 -90
- package/build/modules/animated/create-animated-component.d.ts +0 -48
- package/build/modules/animated/create-animated-component.js +0 -425
- package/build/modules/animated/index.d.ts +0 -51
- package/build/modules/animated/index.js +0 -58
- package/build/modules/app-registry/index.d.ts +0 -7
- package/build/modules/app-registry/index.js +0 -22
- package/build/modules/status-bar/index.d.ts +0 -17
- package/build/modules/status-bar/index.js +0 -121
- package/build/primitives/index.d.ts +0 -32
- package/build/primitives/index.js +0 -386
- package/build/primitives/shared.d.ts +0 -83
- package/build/primitives/shared.js +0 -230
- package/build/render/index.d.ts +0 -11
- package/build/render/index.js +0 -170
- package/build/renderer/index.d.ts +0 -38
- package/build/renderer/index.js +0 -355
- package/build/services/color-scheme.service.d.ts +0 -13
- package/build/services/color-scheme.service.js +0 -72
- package/build/services/index.d.ts +0 -2
- package/build/services/index.js +0 -2
- package/build/services/window-dimensions.service.d.ts +0 -13
- package/build/services/window-dimensions.service.js +0 -83
- package/src/__tests__/responder-change-detection.test.ts +0 -102
- package/src/__tests__/responder-nested-cd.test.ts +0 -113
- package/src/angular-gaps.test.ts +0 -142
- package/src/angular-imports.test.ts +0 -100
- package/src/components/activity-indicator/activity-indicator-class-style.test.ts +0 -44
- package/src/components/activity-indicator/activity-indicator.test.ts +0 -131
- package/src/components/flat-list/column-wrapper-style-class.test.ts +0 -116
- package/src/components/flat-list/flat-list-array-style.test.ts +0 -131
- package/src/components/flat-list/flat-list-class-style.test.ts +0 -74
- package/src/components/flat-list/flat-list-scroll-containment.test.ts +0 -107
- package/src/components/flat-list/flat-list.test.ts +0 -99
- package/src/components/image/image-class-style.test.ts +0 -46
- package/src/components/image-background-class-style.test.ts +0 -48
- package/src/components/image-background-style-class.test.ts +0 -79
- package/src/components/input-accessory-view/input-accessory-view.test.ts +0 -43
- package/src/components/keyboard-avoiding-view/keyboard-avoiding-view.test.ts +0 -54
- package/src/components/modal/modal.test.ts +0 -43
- package/src/components/pressable/pressable.test.ts +0 -85
- package/src/components/refresh-control/refresh-control.test.ts +0 -41
- package/src/components/safe-area-view/safe-area-view.test.ts +0 -43
- package/src/components/scroll-view/android-scroll-view-axis-projection.test.ts +0 -123
- package/src/components/scroll-view/content-container-style-class.test.ts +0 -75
- package/src/components/scroll-view/scroll-view-class-style.test.ts +0 -134
- package/src/components/scroll-view/scroll-view-projection.test.ts +0 -194
- package/src/components/switch/android-switch-class.test.ts +0 -42
- package/src/components/switch/switch.test.ts +0 -92
- package/src/components/text-input-class-style.test.ts +0 -54
- package/src/components/touchable/touchable.test.ts +0 -102
- package/src/components/touchable-native-feedback/touchable-native-feedback.test.ts +0 -49
- package/src/components/virtualized-list/virtualized-list-class-style.test.ts +0 -76
- package/src/components/virtualized-section-list/virtualized-section-list-class-style.test.ts +0 -60
- package/src/create-portal/create-portal.test.ts +0 -90
- package/src/create-tunnel/create-tunnel.test.ts +0 -120
- package/src/descriptor-to-angular/descriptor-outlet.test.ts +0 -94
- package/src/host-instance/host-instance.test.ts +0 -49
- package/src/modules/animated/animated-leaf-binder/animated-leaf-binder.test.ts +0 -116
- package/src/modules/animated/animated-leaf-binder.test.ts +0 -116
- package/src/modules/animated/animated-scroll-view.test.ts +0 -102
- package/src/modules/app-registry/app-registry.test.ts +0 -106
- package/src/modules/status-bar/status-bar.test.ts +0 -50
- package/src/render/render.test.ts +0 -147
- package/src/renderer/renderer.test.ts +0 -202
- package/src/services/services.test.ts +0 -163
|
@@ -1,131 +0,0 @@
|
|
|
1
|
-
import '@angular/compiler';
|
|
2
|
-
import { Component } from '@angular/core';
|
|
3
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
4
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
5
|
-
import { flattenStyle } from '@symbiote-native/engine';
|
|
6
|
-
|
|
7
|
-
import { mount, unmount } from '../../render';
|
|
8
|
-
import { FlatList } from './index';
|
|
9
|
-
import { VListItemDirective } from '../virtualized-list/directives';
|
|
10
|
-
|
|
11
|
-
const ROOT_TAG = 905;
|
|
12
|
-
const fabric = installFabric();
|
|
13
|
-
|
|
14
|
-
interface IChip {
|
|
15
|
-
id: string;
|
|
16
|
-
n: number;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
const chips: IChip[] = Array.from({ length: 24 }, (_unused, index) => ({
|
|
20
|
-
id: `c-${index}`,
|
|
21
|
-
n: index,
|
|
22
|
-
}));
|
|
23
|
-
|
|
24
|
-
// Regression coverage for a real device bug: Angular compiles a literal `[style]="…"` binding to
|
|
25
|
-
// the built-in ɵɵstyleMap instruction (NOT a regular @Input() property write), regardless of the
|
|
26
|
-
// target's declared type — it only understands a flat style object, never an array. RN's own
|
|
27
|
-
// `style={[base, override]}` composition idiom (used by examples/angular/App.ts's "FlatList · 24
|
|
28
|
-
// chips" demo for the per-item computed backgroundColor) crashed deep inside Angular's own styling
|
|
29
|
-
// engine (`prop.indexOf is not a function`), and the crash landed inside a zoneless
|
|
30
|
-
// SymbioteChangeDetectionScheduler tick with no catch around it — so the retry kept re-firing
|
|
31
|
-
// forever (RAM climbing, constant re-render log spam on device) while the item never painted its
|
|
32
|
-
// style. Fixed by flattening any array-composed style with the engine's own `flattenStyle` before
|
|
33
|
-
// it reaches a `[style]=` binding — required of app authors (see App.ts) AND of every adapter
|
|
34
|
-
// component that forwards its own `style` @Input() onward (see the `resolvedStyle` getters/fields
|
|
35
|
-
// in virtualized-list, section-list, virtualized-section-list — flat-list's own `rowStyle` had the
|
|
36
|
-
// identical landmine, always assigning an array).
|
|
37
|
-
@Component({
|
|
38
|
-
selector: 'symbiote-chip-list-host',
|
|
39
|
-
standalone: true,
|
|
40
|
-
imports: [FlatList, VListItemDirective],
|
|
41
|
-
template: `
|
|
42
|
-
<FlatList
|
|
43
|
-
testID="chips-list"
|
|
44
|
-
[data]="chips"
|
|
45
|
-
[horizontal]="true"
|
|
46
|
-
[keyExtractor]="keyExtractor"
|
|
47
|
-
[getItemLayout]="getItemLayout"
|
|
48
|
-
[style]="{ height: 84 }"
|
|
49
|
-
>
|
|
50
|
-
<ng-template vListItem let-item>
|
|
51
|
-
<symbiote-view
|
|
52
|
-
[testID]="'chip-' + item.n"
|
|
53
|
-
[style]="flattenStyle([{ height: 72, width: 64 }, { backgroundColor: chipColor(item) }])"
|
|
54
|
-
>
|
|
55
|
-
<symbiote-text>{{ item.n }}</symbiote-text>
|
|
56
|
-
</symbiote-view>
|
|
57
|
-
</ng-template>
|
|
58
|
-
</FlatList>
|
|
59
|
-
`,
|
|
60
|
-
})
|
|
61
|
-
class ChipListHost {
|
|
62
|
-
chips = chips;
|
|
63
|
-
flattenStyle = flattenStyle;
|
|
64
|
-
keyExtractor = (item: IChip): string => item.id;
|
|
65
|
-
getItemLayout = (
|
|
66
|
-
_data: unknown,
|
|
67
|
-
index: number,
|
|
68
|
-
): { length: number; offset: number; index: number } => ({
|
|
69
|
-
length: 64,
|
|
70
|
-
offset: 64 * index,
|
|
71
|
-
index,
|
|
72
|
-
});
|
|
73
|
-
chipColor(item: IChip): string {
|
|
74
|
-
return `hsl(${(item.n * 47) % 360}, 70%, 50%)`;
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
beforeEach(() => fabric.reset());
|
|
79
|
-
afterEach(() => unmount(ROOT_TAG));
|
|
80
|
-
|
|
81
|
-
function findCommitted(
|
|
82
|
-
nodes: typeof fabric.committed,
|
|
83
|
-
predicate: (n: (typeof nodes)[number]) => boolean,
|
|
84
|
-
): (typeof nodes)[number] | undefined {
|
|
85
|
-
for (const node of nodes) {
|
|
86
|
-
if (predicate(node)) return node;
|
|
87
|
-
const found = findCommitted(node.children, predicate);
|
|
88
|
-
if (found !== undefined) return found;
|
|
89
|
-
}
|
|
90
|
-
return undefined;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
describe('FlatList array-composed item style', () => {
|
|
94
|
-
it('flattens to a plain object instead of crashing ɵɵstyleMap, and commits it', async () => {
|
|
95
|
-
mount(ROOT_TAG, ChipListHost);
|
|
96
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
97
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
98
|
-
|
|
99
|
-
const chip0 = findCommitted(fabric.committed, node => node.props.testID === 'chip-0');
|
|
100
|
-
expect(chip0?.props).toMatchObject({
|
|
101
|
-
height: 72,
|
|
102
|
-
width: 64,
|
|
103
|
-
backgroundColor: 'hsl(0, 70%, 50%)',
|
|
104
|
-
});
|
|
105
|
-
});
|
|
106
|
-
|
|
107
|
-
it('does not free-run change detection once the window settles', async () => {
|
|
108
|
-
mount(ROOT_TAG, ChipListHost);
|
|
109
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
110
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
111
|
-
|
|
112
|
-
const scroll = fabric.find(node => node.viewName === 'RCTScrollView');
|
|
113
|
-
if (scroll !== undefined) {
|
|
114
|
-
fabric.fireEvent(scroll.instanceHandle, 'topLayout', {
|
|
115
|
-
layout: { x: 0, y: 0, width: 360, height: 84 },
|
|
116
|
-
});
|
|
117
|
-
}
|
|
118
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
119
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
120
|
-
|
|
121
|
-
let previous = fabric.counts.completeRoot;
|
|
122
|
-
let stillGrowing = false;
|
|
123
|
-
for (let tick = 0; tick < 10; tick += 1) {
|
|
124
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
125
|
-
const current = fabric.counts.completeRoot;
|
|
126
|
-
if (current > previous) stillGrowing = true;
|
|
127
|
-
previous = current;
|
|
128
|
-
}
|
|
129
|
-
expect(stillGrowing).toBe(false);
|
|
130
|
-
});
|
|
131
|
-
});
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug: FlatList is its own
|
|
2
|
-
// ANCHOR_HOST_COMPONENTS entry, separate from the VirtualizedList/ScrollView anchors it wraps two
|
|
3
|
-
// levels down — a class= on <FlatList> resolves onto FlatList's OWN anchor and needs its OWN
|
|
4
|
-
// anchorHostStyle merge (see index.ts's ngOnChanges), it is NOT transitively fixed by
|
|
5
|
-
// VirtualizedList's or ScrollView's own fixes. Mirrors pressable.test.ts's "resolves a class=" case.
|
|
6
|
-
import '@angular/compiler';
|
|
7
|
-
import { Component } from '@angular/core';
|
|
8
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
9
|
-
import { clearGlobalStyles, registerStyles } from '@symbiote-native/engine';
|
|
10
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
11
|
-
|
|
12
|
-
import { mount, unmount } from '../../render';
|
|
13
|
-
import { FlatList } from './index';
|
|
14
|
-
import { VListItemDirective } from '../virtualized-list/directives';
|
|
15
|
-
|
|
16
|
-
const ROOT_TAG = 951;
|
|
17
|
-
const fabric = installFabric();
|
|
18
|
-
const tick = (): Promise<void> => new Promise(resolve => setTimeout(resolve, 0));
|
|
19
|
-
|
|
20
|
-
interface IRow {
|
|
21
|
-
id: string;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
const rows: IRow[] = [{ id: 'a' }, { id: 'b' }];
|
|
25
|
-
|
|
26
|
-
@Component({
|
|
27
|
-
selector: 'symbiote-flatlist-class-host',
|
|
28
|
-
standalone: true,
|
|
29
|
-
imports: [FlatList, VListItemDirective],
|
|
30
|
-
template: `
|
|
31
|
-
<FlatList
|
|
32
|
-
class="card"
|
|
33
|
-
[data]="rows"
|
|
34
|
-
[keyExtractor]="keyExtractor"
|
|
35
|
-
[getItemLayout]="getItemLayout"
|
|
36
|
-
>
|
|
37
|
-
<ng-template vListItem let-item>
|
|
38
|
-
<symbiote-text [testID]="item.id">{{ item.id }}</symbiote-text>
|
|
39
|
-
</ng-template>
|
|
40
|
-
</FlatList>
|
|
41
|
-
`,
|
|
42
|
-
})
|
|
43
|
-
class FlatListClassHost {
|
|
44
|
-
rows = rows;
|
|
45
|
-
keyExtractor = (item: IRow): string => item.id;
|
|
46
|
-
getItemLayout = (
|
|
47
|
-
_data: unknown,
|
|
48
|
-
index: number,
|
|
49
|
-
): { length: number; offset: number; index: number } => ({
|
|
50
|
-
length: 30,
|
|
51
|
-
offset: 30 * index,
|
|
52
|
-
index,
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
beforeEach(() => {
|
|
57
|
-
fabric.reset();
|
|
58
|
-
registerStyles({ card: { backgroundColor: 'red' } });
|
|
59
|
-
});
|
|
60
|
-
afterEach(() => {
|
|
61
|
-
unmount(ROOT_TAG);
|
|
62
|
-
clearGlobalStyles();
|
|
63
|
-
});
|
|
64
|
-
|
|
65
|
-
describe('FlatList anchor class= resolution', () => {
|
|
66
|
-
it('resolves a class= on the FlatList use site onto the real committed scroll host', async () => {
|
|
67
|
-
mount(ROOT_TAG, FlatListClassHost);
|
|
68
|
-
await tick();
|
|
69
|
-
await tick();
|
|
70
|
-
|
|
71
|
-
const node = fabric.find(n => n.props.backgroundColor === 'red');
|
|
72
|
-
expect(node, 'a real Fabric node carries the class-derived style').toBeDefined();
|
|
73
|
-
});
|
|
74
|
-
});
|
|
@@ -1,107 +0,0 @@
|
|
|
1
|
-
import '@angular/compiler';
|
|
2
|
-
import { Component } from '@angular/core';
|
|
3
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
4
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
5
|
-
|
|
6
|
-
import { mount, unmount } from '../../render';
|
|
7
|
-
import { FlatList } from './index';
|
|
8
|
-
import { VListItemDirective } from '../virtualized-list/directives';
|
|
9
|
-
|
|
10
|
-
const ROOT_TAG = 907;
|
|
11
|
-
const fabric = installFabric();
|
|
12
|
-
|
|
13
|
-
interface IChip {
|
|
14
|
-
id: string;
|
|
15
|
-
n: number;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
const chips: IChip[] = Array.from({ length: 24 }, (_unused, index) => ({
|
|
19
|
-
id: `c-${index}`,
|
|
20
|
-
n: index,
|
|
21
|
-
}));
|
|
22
|
-
|
|
23
|
-
// Mirrors examples/angular/App.ts's "FlatList · 24 chips" demo end to end: a horizontal FlatList
|
|
24
|
-
// with getItemLayout. Regression coverage for a bug fixed 2026-07: cell content used to land
|
|
25
|
-
// OUTSIDE the ScrollView's content view entirely — as top-level siblings
|
|
26
|
-
// of the committed RCTScrollView node, instead of children of its RCTScrollContentView — which is
|
|
27
|
-
// why the device screenshot showed full-width vertically-stacked chips instead of a small
|
|
28
|
-
// horizontal row. Root cause was `<ng-content>` declared once per `@if`/`@else` branch in
|
|
29
|
-
// scroll-view/index.ios.ts (a documented Angular limitation, angular/angular#53310); fixed by
|
|
30
|
-
// collapsing to a single unconditional host tag since iOS never needed axis-specific tags to begin
|
|
31
|
-
// with (`horizontal` already flows as a plain prop). This test pins the CORRECT tree shape.
|
|
32
|
-
@Component({
|
|
33
|
-
selector: 'symbiote-chip-container-host',
|
|
34
|
-
standalone: true,
|
|
35
|
-
imports: [FlatList, VListItemDirective],
|
|
36
|
-
template: `
|
|
37
|
-
<FlatList
|
|
38
|
-
testID="chips-list"
|
|
39
|
-
[data]="chips"
|
|
40
|
-
[horizontal]="true"
|
|
41
|
-
[keyExtractor]="keyExtractor"
|
|
42
|
-
[getItemLayout]="getItemLayout"
|
|
43
|
-
[style]="chipListStyle"
|
|
44
|
-
>
|
|
45
|
-
<ng-template vListItem let-item>
|
|
46
|
-
<symbiote-view [testID]="'chip-' + item.n" [style]="chipCardStyle">
|
|
47
|
-
<symbiote-text>{{ item.n }}</symbiote-text>
|
|
48
|
-
</symbiote-view>
|
|
49
|
-
</ng-template>
|
|
50
|
-
</FlatList>
|
|
51
|
-
`,
|
|
52
|
-
})
|
|
53
|
-
class ChipContainerHost {
|
|
54
|
-
chips = chips;
|
|
55
|
-
chipListStyle = { height: 84 };
|
|
56
|
-
chipCardStyle = { width: 72, height: 64, borderRadius: 14 };
|
|
57
|
-
keyExtractor = (item: IChip): string => item.id;
|
|
58
|
-
getItemLayout = (
|
|
59
|
-
_data: unknown,
|
|
60
|
-
index: number,
|
|
61
|
-
): { length: number; offset: number; index: number } => ({
|
|
62
|
-
length: 64,
|
|
63
|
-
offset: 64 * index,
|
|
64
|
-
index,
|
|
65
|
-
});
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
beforeEach(() => fabric.reset());
|
|
69
|
-
afterEach(() => unmount(ROOT_TAG));
|
|
70
|
-
|
|
71
|
-
function findWithin(
|
|
72
|
-
root: (typeof fabric.committed)[number],
|
|
73
|
-
predicate: (n: (typeof fabric.committed)[number]) => boolean,
|
|
74
|
-
): (typeof fabric.committed)[number] | undefined {
|
|
75
|
-
if (predicate(root)) return root;
|
|
76
|
-
for (const child of root.children) {
|
|
77
|
-
const found = findWithin(child, predicate);
|
|
78
|
-
if (found !== undefined) return found;
|
|
79
|
-
}
|
|
80
|
-
return undefined;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
function findTop(
|
|
84
|
-
nodes: typeof fabric.committed,
|
|
85
|
-
predicate: (n: (typeof nodes)[number]) => boolean,
|
|
86
|
-
): (typeof nodes)[number] | undefined {
|
|
87
|
-
for (const node of nodes) {
|
|
88
|
-
const found = findWithin(node, predicate);
|
|
89
|
-
if (found !== undefined) return found;
|
|
90
|
-
}
|
|
91
|
-
return undefined;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
describe('FlatList cells stay inside the ScrollView content view', () => {
|
|
95
|
-
it('nests chip cells under RCTScrollContentView, not as siblings of RCTScrollView', async () => {
|
|
96
|
-
mount(ROOT_TAG, ChipContainerHost);
|
|
97
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
98
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
99
|
-
|
|
100
|
-
const scroll = findTop(fabric.committed, node => node.viewName === 'RCTScrollView');
|
|
101
|
-
expect(scroll).toBeDefined();
|
|
102
|
-
if (scroll === undefined) return;
|
|
103
|
-
|
|
104
|
-
const chip0InsideScroll = findWithin(scroll, node => node.props.testID === 'chip-0');
|
|
105
|
-
expect(chip0InsideScroll).toBeDefined();
|
|
106
|
-
});
|
|
107
|
-
});
|
|
@@ -1,99 +0,0 @@
|
|
|
1
|
-
import '@angular/compiler';
|
|
2
|
-
import { Component } from '@angular/core';
|
|
3
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
4
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
5
|
-
|
|
6
|
-
import { mount, unmount } from '../../render';
|
|
7
|
-
import { FlatList } from './index';
|
|
8
|
-
import {
|
|
9
|
-
VListEmptyDirective,
|
|
10
|
-
VListFooterDirective,
|
|
11
|
-
VListHeaderDirective,
|
|
12
|
-
VListItemDirective,
|
|
13
|
-
} from '../virtualized-list/directives';
|
|
14
|
-
|
|
15
|
-
const ROOT_TAG = 904;
|
|
16
|
-
const fabric = installFabric();
|
|
17
|
-
|
|
18
|
-
interface IRow {
|
|
19
|
-
id: string;
|
|
20
|
-
n: number;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
const rows: IRow[] = Array.from({ length: 5 }, (_unused, index) => ({
|
|
24
|
-
id: `r-${index}`,
|
|
25
|
-
n: index,
|
|
26
|
-
}));
|
|
27
|
-
|
|
28
|
-
// Regression coverage for a real bug: FlatList's single-column path used to forward the app's
|
|
29
|
-
// <ng-template vListItem> to the inner VirtualizedList via a bare <ng-content></ng-content>
|
|
30
|
-
// passthrough. Angular's @ContentChild does NOT resolve a directive across that second projection
|
|
31
|
-
// hop (it only sees what was projected directly onto the querying component's own tag), so
|
|
32
|
-
// VirtualizedList's itemDir stayed undefined and every cell rendered empty — a real device symptom
|
|
33
|
-
// (a blank list) that headless testing never caught because no test existed for this component
|
|
34
|
-
// family. Fixed by having FlatList capture its own @ContentChild (a single, direct hop) and
|
|
35
|
-
// re-stamp explicit <ng-template>s onto <VirtualizedList>, mirroring VirtualizedSectionList's own
|
|
36
|
-
// (already-working) re-stamp pattern. SectionList had the identical bug, fixed the same way.
|
|
37
|
-
@Component({
|
|
38
|
-
selector: 'symbiote-flatlist-host',
|
|
39
|
-
standalone: true,
|
|
40
|
-
imports: [
|
|
41
|
-
FlatList,
|
|
42
|
-
VListItemDirective,
|
|
43
|
-
VListHeaderDirective,
|
|
44
|
-
VListFooterDirective,
|
|
45
|
-
VListEmptyDirective,
|
|
46
|
-
],
|
|
47
|
-
template: `
|
|
48
|
-
<FlatList
|
|
49
|
-
testID="rows-list"
|
|
50
|
-
[data]="rows"
|
|
51
|
-
[keyExtractor]="keyExtractor"
|
|
52
|
-
[getItemLayout]="getItemLayout"
|
|
53
|
-
[style]="{ height: 120 }"
|
|
54
|
-
>
|
|
55
|
-
<ng-template vListHeader>
|
|
56
|
-
<symbiote-text testID="header">header</symbiote-text>
|
|
57
|
-
</ng-template>
|
|
58
|
-
<ng-template vListItem let-item>
|
|
59
|
-
<symbiote-text [testID]="'row-' + item.n">{{ 'row ' + item.n }}</symbiote-text>
|
|
60
|
-
</ng-template>
|
|
61
|
-
<ng-template vListFooter>
|
|
62
|
-
<symbiote-text testID="footer">footer</symbiote-text>
|
|
63
|
-
</ng-template>
|
|
64
|
-
</FlatList>
|
|
65
|
-
`,
|
|
66
|
-
})
|
|
67
|
-
class FlatListHost {
|
|
68
|
-
rows = rows;
|
|
69
|
-
keyExtractor = (item: IRow): string => item.id;
|
|
70
|
-
getItemLayout = (
|
|
71
|
-
_data: unknown,
|
|
72
|
-
index: number,
|
|
73
|
-
): { length: number; offset: number; index: number } => ({
|
|
74
|
-
length: 30,
|
|
75
|
-
offset: 30 * index,
|
|
76
|
-
index,
|
|
77
|
-
});
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
beforeEach(() => fabric.reset());
|
|
81
|
-
afterEach(() => unmount(ROOT_TAG));
|
|
82
|
-
|
|
83
|
-
describe('FlatList', () => {
|
|
84
|
-
it('stamps the header, every row, and the footer through the projected templates', async () => {
|
|
85
|
-
mount(ROOT_TAG, FlatListHost);
|
|
86
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
87
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
88
|
-
|
|
89
|
-
const texts = fabric.created
|
|
90
|
-
.filter(node => node.props.testID !== undefined)
|
|
91
|
-
.map(node => node.props.testID);
|
|
92
|
-
|
|
93
|
-
expect(texts).toContain('header');
|
|
94
|
-
expect(texts).toContain('footer');
|
|
95
|
-
for (let index = 0; index < rows.length; index += 1) {
|
|
96
|
-
expect(texts).toContain(`row-${index}`);
|
|
97
|
-
}
|
|
98
|
-
});
|
|
99
|
-
});
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug: Image is its own
|
|
2
|
-
// ANCHOR_HOST_COMPONENTS entry — a class= on <Image> resolves onto Image's OWN anchor and needs
|
|
3
|
-
// its OWN anchorHostStyle merge (see index.ios.ts/index.android.ts's imageProps override), not
|
|
4
|
-
// transitively fixed by anything else. Mirrors pressable.test.ts's "resolves a class=" case.
|
|
5
|
-
import '@angular/compiler';
|
|
6
|
-
import { Component } from '@angular/core';
|
|
7
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
8
|
-
import { clearGlobalStyles, registerStyles } from '@symbiote-native/engine';
|
|
9
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
10
|
-
|
|
11
|
-
import { mount, unmount } from '../../render';
|
|
12
|
-
import { Image } from './index';
|
|
13
|
-
|
|
14
|
-
const ROOT_TAG = 915;
|
|
15
|
-
const fabric = installFabric();
|
|
16
|
-
|
|
17
|
-
@Component({
|
|
18
|
-
selector: 'symbiote-image-class-host',
|
|
19
|
-
standalone: true,
|
|
20
|
-
imports: [Image],
|
|
21
|
-
template: `<Image
|
|
22
|
-
[testID]="'photo'"
|
|
23
|
-
class="card"
|
|
24
|
-
[source]="{ uri: 'https://example.com/a.png' }"
|
|
25
|
-
/>`,
|
|
26
|
-
})
|
|
27
|
-
class ImageClassHost {}
|
|
28
|
-
|
|
29
|
-
beforeEach(() => {
|
|
30
|
-
fabric.reset();
|
|
31
|
-
registerStyles({ card: { backgroundColor: 'red' } });
|
|
32
|
-
});
|
|
33
|
-
afterEach(() => {
|
|
34
|
-
unmount(ROOT_TAG);
|
|
35
|
-
clearGlobalStyles();
|
|
36
|
-
});
|
|
37
|
-
|
|
38
|
-
describe('Image anchor class= resolution', () => {
|
|
39
|
-
it('resolves a class= on the Image use site onto the real committed view, not the anchor', async () => {
|
|
40
|
-
mount(ROOT_TAG, ImageClassHost);
|
|
41
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
42
|
-
|
|
43
|
-
const node = fabric.find(n => n.props.testID === 'photo');
|
|
44
|
-
expect(node?.props.backgroundColor).toBe('red');
|
|
45
|
-
});
|
|
46
|
-
});
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
// Regression test for the anchor/class bug: ImageBackground is its own
|
|
2
|
-
// ANCHOR_HOST_COMPONENTS entry, separate from the Image it composes internally — a class= on
|
|
3
|
-
// <ImageBackground> resolves onto ImageBackground's OWN anchor and needs its OWN anchorHostStyle
|
|
4
|
-
// merge onto its wrapper View (see image-background.ts's wrapperStyle getter), NOT onto its
|
|
5
|
-
// `imageStyle` (a separate, deliberately untouched prop — see the file's header comment).
|
|
6
|
-
// Mirrors pressable.test.ts's "resolves a class=" case.
|
|
7
|
-
import '@angular/compiler';
|
|
8
|
-
import { Component } from '@angular/core';
|
|
9
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
10
|
-
import { clearGlobalStyles, registerStyles } from '@symbiote-native/engine';
|
|
11
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
12
|
-
|
|
13
|
-
import { mount, unmount } from '../render';
|
|
14
|
-
import { ImageBackground } from './image-background';
|
|
15
|
-
|
|
16
|
-
const ROOT_TAG = 916;
|
|
17
|
-
const fabric = installFabric();
|
|
18
|
-
|
|
19
|
-
@Component({
|
|
20
|
-
selector: 'symbiote-image-background-class-host',
|
|
21
|
-
standalone: true,
|
|
22
|
-
imports: [ImageBackground],
|
|
23
|
-
template: `
|
|
24
|
-
<ImageBackground class="card" [source]="{ uri: 'https://example.com/a.png' }">
|
|
25
|
-
<symbiote-text>on top</symbiote-text>
|
|
26
|
-
</ImageBackground>
|
|
27
|
-
`,
|
|
28
|
-
})
|
|
29
|
-
class ImageBackgroundClassHost {}
|
|
30
|
-
|
|
31
|
-
beforeEach(() => {
|
|
32
|
-
fabric.reset();
|
|
33
|
-
registerStyles({ card: { backgroundColor: 'red' } });
|
|
34
|
-
});
|
|
35
|
-
afterEach(() => {
|
|
36
|
-
unmount(ROOT_TAG);
|
|
37
|
-
clearGlobalStyles();
|
|
38
|
-
});
|
|
39
|
-
|
|
40
|
-
describe('ImageBackground anchor class= resolution', () => {
|
|
41
|
-
it('resolves a class= on the ImageBackground use site onto the real committed wrapper View', async () => {
|
|
42
|
-
mount(ROOT_TAG, ImageBackgroundClassHost);
|
|
43
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
44
|
-
|
|
45
|
-
const node = fabric.find(n => n.props.backgroundColor === 'red');
|
|
46
|
-
expect(node, 'a real Fabric node carries the class-derived style').toBeDefined();
|
|
47
|
-
});
|
|
48
|
-
});
|
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
// Regression guard: imageStyle previously accepted ONLY a JS style object/array. It now also
|
|
2
|
-
// resolves a class-name string through the shared style registry, same as the `class` prop fix on
|
|
3
|
-
// the WRAPPER view (see image-background-class-style.test.ts) — and must land on the INNER image,
|
|
4
|
-
// never the wrapper, exactly like that prior fix. Mirrors the Vue twin
|
|
5
|
-
// (image-background-style-class.test.ts).
|
|
6
|
-
import '@angular/compiler';
|
|
7
|
-
import { Component } from '@angular/core';
|
|
8
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
9
|
-
import { clearGlobalStyles, registerStyles } from '@symbiote-native/engine';
|
|
10
|
-
import { installFabric, type IFakeNode } from '@symbiote-native/test-utils';
|
|
11
|
-
|
|
12
|
-
import { mount, unmount } from '../render';
|
|
13
|
-
import { ImageBackground } from './image-background';
|
|
14
|
-
|
|
15
|
-
const ROOT_TAG = 917;
|
|
16
|
-
const fabric = installFabric();
|
|
17
|
-
const tick = (): Promise<void> => new Promise(resolve => setTimeout(resolve, 0));
|
|
18
|
-
|
|
19
|
-
function committedImage(): IFakeNode {
|
|
20
|
-
const node = fabric.find(n => n.viewName === 'RCTImageView');
|
|
21
|
-
expect(node, 'the inner image was committed').toBeDefined();
|
|
22
|
-
if (node === undefined) throw new Error('unreachable: image missing');
|
|
23
|
-
return node;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
function committedWrapper(): IFakeNode {
|
|
27
|
-
const node = fabric.find(n => n.viewName === 'RCTView');
|
|
28
|
-
expect(node, 'the wrapper view was committed').toBeDefined();
|
|
29
|
-
if (node === undefined) throw new Error('unreachable: wrapper missing');
|
|
30
|
-
return node;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
@Component({
|
|
34
|
-
selector: 'symbiote-image-background-style-class-host',
|
|
35
|
-
standalone: true,
|
|
36
|
-
imports: [ImageBackground],
|
|
37
|
-
template: `<ImageBackground
|
|
38
|
-
[source]="{ uri: 'https://example.com/a.png' }"
|
|
39
|
-
[imageStyle]="'tinted'"
|
|
40
|
-
/>`,
|
|
41
|
-
})
|
|
42
|
-
class ImageBackgroundStyleClassHost {}
|
|
43
|
-
|
|
44
|
-
@Component({
|
|
45
|
-
selector: 'symbiote-image-background-style-object-host',
|
|
46
|
-
standalone: true,
|
|
47
|
-
imports: [ImageBackground],
|
|
48
|
-
template: `<ImageBackground
|
|
49
|
-
[source]="{ uri: 'https://example.com/a.png' }"
|
|
50
|
-
[imageStyle]="{ opacity: 0.25 }"
|
|
51
|
-
/>`,
|
|
52
|
-
})
|
|
53
|
-
class ImageBackgroundStyleObjectHost {}
|
|
54
|
-
|
|
55
|
-
beforeEach(() => {
|
|
56
|
-
fabric.reset();
|
|
57
|
-
registerStyles({ tinted: { opacity: 0.5 } });
|
|
58
|
-
});
|
|
59
|
-
afterEach(() => {
|
|
60
|
-
unmount(ROOT_TAG);
|
|
61
|
-
clearGlobalStyles();
|
|
62
|
-
});
|
|
63
|
-
|
|
64
|
-
describe('ImageBackground imageStyle class-name support', () => {
|
|
65
|
-
it('resolves a class-name string onto the inner image, not the wrapper', async () => {
|
|
66
|
-
mount(ROOT_TAG, ImageBackgroundStyleClassHost);
|
|
67
|
-
await tick();
|
|
68
|
-
|
|
69
|
-
expect(committedImage().props.opacity).toBe(0.5);
|
|
70
|
-
expect(committedWrapper().props.opacity).toBeUndefined();
|
|
71
|
-
});
|
|
72
|
-
|
|
73
|
-
it('still accepts an ordinary style object unchanged', async () => {
|
|
74
|
-
mount(ROOT_TAG, ImageBackgroundStyleObjectHost);
|
|
75
|
-
await tick();
|
|
76
|
-
|
|
77
|
-
expect(committedImage().props.opacity).toBe(0.25);
|
|
78
|
-
});
|
|
79
|
-
});
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
import '@angular/compiler';
|
|
2
|
-
import { Component } from '@angular/core';
|
|
3
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
4
|
-
import { clearGlobalStyles, registerStyles } from '@symbiote-native/engine';
|
|
5
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
6
|
-
|
|
7
|
-
import { mount, unmount } from '../../render';
|
|
8
|
-
import { InputAccessoryView } from './index';
|
|
9
|
-
|
|
10
|
-
const ROOT_TAG = 913;
|
|
11
|
-
const fabric = installFabric();
|
|
12
|
-
|
|
13
|
-
@Component({
|
|
14
|
-
selector: 'symbiote-iav-host',
|
|
15
|
-
standalone: true,
|
|
16
|
-
imports: [InputAccessoryView],
|
|
17
|
-
template: `
|
|
18
|
-
<InputAccessoryView [testID]="'iav'" class="toolbar">
|
|
19
|
-
<symbiote-text>Hello</symbiote-text>
|
|
20
|
-
</InputAccessoryView>
|
|
21
|
-
`,
|
|
22
|
-
})
|
|
23
|
-
class InputAccessoryViewHostFixture {}
|
|
24
|
-
|
|
25
|
-
beforeEach(() => {
|
|
26
|
-
fabric.reset();
|
|
27
|
-
});
|
|
28
|
-
afterEach(() => {
|
|
29
|
-
unmount(ROOT_TAG);
|
|
30
|
-
clearGlobalStyles();
|
|
31
|
-
});
|
|
32
|
-
|
|
33
|
-
describe('InputAccessoryView', () => {
|
|
34
|
-
it('resolves a class= on the InputAccessoryView use site onto the real committed view, not the anchor', async () => {
|
|
35
|
-
registerStyles({ toolbar: { backgroundColor: 'orange' } });
|
|
36
|
-
|
|
37
|
-
mount(ROOT_TAG, InputAccessoryViewHostFixture);
|
|
38
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
39
|
-
|
|
40
|
-
const node = fabric.find(n => n.props.testID === 'iav');
|
|
41
|
-
expect(node?.props.backgroundColor).toBe('orange');
|
|
42
|
-
});
|
|
43
|
-
});
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import '@angular/compiler';
|
|
2
|
-
import { Component } from '@angular/core';
|
|
3
|
-
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
4
|
-
import { clearGlobalStyles, registerStyles } from '@symbiote-native/engine';
|
|
5
|
-
import { installFabric } from '@symbiote-native/test-utils';
|
|
6
|
-
|
|
7
|
-
import { mount, unmount } from '../../render';
|
|
8
|
-
import { KeyboardAvoidingView } from './index';
|
|
9
|
-
|
|
10
|
-
const ROOT_TAG = 911;
|
|
11
|
-
const fabric = installFabric();
|
|
12
|
-
|
|
13
|
-
// KeyboardAvoidingView's ngOnInit subscribes to the Keyboard module, which installs the
|
|
14
|
-
// bridgeless device-event hub on first use — needs a fake RN$registerCallableModule so
|
|
15
|
-
// installDeviceEventHub() doesn't throw (core/engine/src/native-events.ts). No native event is
|
|
16
|
-
// actually emitted in this test, only the subscribe/unsubscribe lifecycle runs.
|
|
17
|
-
Object.assign(globalThis, {
|
|
18
|
-
RN$registerCallableModule: (
|
|
19
|
-
_name: string,
|
|
20
|
-
_factory: () => { emit: (eventType: string, ...args: unknown[]) => void },
|
|
21
|
-
): void => {},
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
@Component({
|
|
25
|
-
selector: 'symbiote-kav-host',
|
|
26
|
-
standalone: true,
|
|
27
|
-
imports: [KeyboardAvoidingView],
|
|
28
|
-
template: `
|
|
29
|
-
<KeyboardAvoidingView [testID]="'kav'" class="panel">
|
|
30
|
-
<symbiote-text>Hello</symbiote-text>
|
|
31
|
-
</KeyboardAvoidingView>
|
|
32
|
-
`,
|
|
33
|
-
})
|
|
34
|
-
class KeyboardAvoidingViewHostFixture {}
|
|
35
|
-
|
|
36
|
-
beforeEach(() => {
|
|
37
|
-
fabric.reset();
|
|
38
|
-
});
|
|
39
|
-
afterEach(() => {
|
|
40
|
-
unmount(ROOT_TAG);
|
|
41
|
-
clearGlobalStyles();
|
|
42
|
-
});
|
|
43
|
-
|
|
44
|
-
describe('KeyboardAvoidingView', () => {
|
|
45
|
-
it('resolves a class= on the KeyboardAvoidingView use site onto the real committed view, not the anchor', async () => {
|
|
46
|
-
registerStyles({ panel: { backgroundColor: 'teal' } });
|
|
47
|
-
|
|
48
|
-
mount(ROOT_TAG, KeyboardAvoidingViewHostFixture);
|
|
49
|
-
await new Promise<void>(resolve => setTimeout(resolve, 0));
|
|
50
|
-
|
|
51
|
-
const node = fabric.find(n => n.props.testID === 'kav');
|
|
52
|
-
expect(node?.props.backgroundColor).toBe('teal');
|
|
53
|
-
});
|
|
54
|
-
});
|