Skip to content

Commit 800f5bc

Browse files
MartoYankovMartoYankov
authored
fix: tab navigations don't work with lowercase xml (#8016)
1 parent b069ff3 commit 800f5bc

11 files changed

Lines changed: 116 additions & 17 deletions

File tree

‎api-reports/NativeScript.api.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2304,6 +2304,9 @@ export class TabStripItem extends View {
23042304

23052305
image: Image;
23062306

2307+
// (undocumented)
2308+
_index: number;
2309+
23072310
label: Label;
23082311

23092312
on(eventNames: string, callback: (data: EventData) => void);

‎nativescript-core/ui/tab-navigation-base/tab-navigation-base/tab-navigation-base.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
// Types
22
import { TabNavigationBase as TabNavigationBaseDefinition, SelectedIndexChangedEventData } from ".";
3-
import { TabContentItem } from "../tab-content-item";
4-
import { TabStrip } from "../tab-strip";
53
import { TabStripItem } from "../tab-strip-item";
64
import { ViewBase, AddArrayFromBuilder, AddChildFromBuilder, EventData } from "../../core/view";
75

86
// Requires
9-
import { View, Property, CoercibleProperty, isIOS, Color } from "../../core/view";
7+
import { View, Property, CoercibleProperty, isIOS } from "../../core/view";
8+
import { TabContentItem } from "../tab-content-item";
9+
import { TabStrip } from "../tab-strip";
1010

1111
// TODO: Impl trace
1212
// export const traceCategory = "TabView";
@@ -29,14 +29,14 @@ export class TabNavigationBase extends View implements TabNavigationBaseDefiniti
2929
}
3030

3131
public _addChildFromBuilder(name: string, value: any): void {
32-
if (name === "TabContentItem") {
32+
if (value instanceof TabContentItem) {
3333
if (!this.items) {
3434
this.items = new Array<TabContentItem>();
3535
}
3636
this.items.push(<TabContentItem>value);
3737
this._addView(value);
3838
// selectedIndexProperty.coerce(this);
39-
} else if (name === "TabStrip") {
39+
} else if (value instanceof TabStrip) {
4040
// Setting tabStrip will trigger onTabStripChanged
4141
this.tabStrip = value;
4242
}

‎nativescript-core/ui/tab-navigation-base/tab-strip-item/tab-strip-item.ts‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,16 @@ import { TabStripItem as TabStripItemDefinition } from ".";
33
import { PropertyChangeData } from "../../../data/observable";
44
import { TabNavigationBase } from "../tab-navigation-base";
55
import { TabStrip } from "../tab-strip";
6-
import { Image } from "../../image/image";
7-
import { Label } from "../../label/label";
86
import { Color } from "../../../color";
97
import { AddChildFromBuilder } from "../../core/view";
108

119
// Requires
1210
import {
1311
View, ViewBase, CSSType, backgroundColorProperty, backgroundInternalProperty, PseudoClassHandler
1412
} from "../../core/view";
15-
import { Tabs } from "../../tabs";
1613
import { isIOS } from "../../../platform";
14+
import { Image } from "../../image/image";
15+
import { Label } from "../../label/label";
1716

1817
export * from "../../core/view";
1918
export const traceCategory = "TabView";
@@ -173,14 +172,14 @@ export class TabStripItem extends View implements TabStripItemDefinition, AddChi
173172
}
174173

175174
public _addChildFromBuilder(name: string, value: any): void {
176-
if (name === "Image") {
175+
if (value instanceof Image) {
177176
this.image = <Image>value;
178177
this.iconSource = (<Image>value).src;
179178
this._addView(value);
180179
// selectedIndexProperty.coerce(this);
181180
}
182181

183-
if (name === "Label") {
182+
if (value instanceof Label) {
184183
this.label = <Label>value;
185184
this.title = (<Label>value).text;
186185
this._addView(value);
@@ -213,7 +212,9 @@ export class TabStripItem extends View implements TabStripItemDefinition, AddChi
213212
const parent = <TabStrip>this.parent;
214213
const tabStripParent = parent && <TabNavigationBase>parent.parent;
215214
if (this._index === tabStripParent.selectedIndex &&
216-
!(isIOS && tabStripParent instanceof Tabs)) {
215+
!(isIOS && tabStripParent.cssType.toLowerCase() === "tabs")) {
216+
// HACK: tabStripParent instanceof Tabs creates a circular dependency
217+
// HACK: tabStripParent.cssType === "Tabs" is a hacky workaround
217218
this._goToVisualState("highlighted");
218219
}
219220
} else {

‎nativescript-core/ui/tab-navigation-base/tab-strip/tab-strip.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@
22
import { Color } from "../../../color";
33
import { AddArrayFromBuilder, AddChildFromBuilder, EventData, ViewBase } from "../../core/view";
44
import { TabNavigationBase } from "../tab-navigation-base";
5-
import { TabStripItem } from "../tab-strip-item";
65
import { TabStripItemEventData, TabStrip as TabStripDefinition } from "./";
76

87
// Requires
98
import {
109
backgroundColorProperty, backgroundInternalProperty, booleanConverter,
1110
colorProperty, CSSType, fontInternalProperty, Property, View
1211
} from "../../core/view";
12+
import { TabStripItem } from "../tab-strip-item";
1313
import { textTransformProperty } from "../../text-base";
1414

1515
export const traceCategory = "TabView";
@@ -44,7 +44,7 @@ export class TabStrip extends View implements TabStripDefinition, AddChildFromBu
4444
}
4545

4646
public _addChildFromBuilder(name: string, value: any): void {
47-
if (name === "TabStripItem") {
47+
if (value instanceof TabStripItem) {
4848
if (!this.items) {
4949
this.items = new Array<TabStripItem>();
5050
}

‎nativescript-core/ui/tab-view/tab-view-common.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ export class TabViewBase extends View implements TabViewDefinition, AddChildFrom
140140
}
141141

142142
public _addChildFromBuilder(name: string, value: any): void {
143-
if (name === "TabViewItem") {
143+
if (value instanceof TabViewItemBase) {
144144
if (!this.items) {
145145
this.items = new Array<TabViewItemBase>();
146146
}

‎tests/app/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"main": "app.js",
33
"android": {
4-
"v8Flags": "--expose_gc"
4+
"v8Flags": "--expose_gc",
5+
"markingMode": "none"
56
}
67
}

‎tests/app/test-runner.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -199,19 +199,28 @@ allTests["LABEL"] = labelTests;
199199
import * as bottomNavigationTests from "./ui/bottom-navigation/bottom-navigation-tests";
200200
allTests["BOTTOM-NAVIGATION"] = bottomNavigationTests;
201201

202+
import * as bottomNavigationTestsNew from "./ui/bottom-navigation/bottom-navigation-tests-new";
203+
allTests["BOTTOM-NAVIGATION-NEW"] = bottomNavigationTestsNew;
204+
202205
import * as bottomNavigationNavigationTests from "./ui/bottom-navigation/bottom-navigation-navigation-tests";
203206
// TODO: uncomment this
204207
// allTests["BOTTOM-NAVIGATION-NAVIGATION"] = bottomNavigationNavigationTests;
205208

206209
import * as tabsTests from "./ui/tabs/tabs-tests";
207210
allTests["TABS"] = tabsTests;
208211

212+
import * as tabsTestsNew from "./ui/tabs/tabs-tests-new";
213+
allTests["TABS-NEW"] = tabsTestsNew;
214+
209215
import * as tabsNavigationTests from "./ui/tabs/tabs-navigation-tests";
210216
allTests["TABS-NAVIGATION"] = tabsNavigationTests;
211217

212218
import * as tabViewTests from "./ui/tab-view/tab-view-tests";
213219
allTests["TAB-VIEW"] = tabViewTests;
214220

221+
import * as tabViewTestsNew from "./ui/tab-view/tab-view-tests-new";
222+
allTests["TAB-VIEW-NEW"] = tabViewTestsNew;
223+
215224
import * as tabViewNavigationTests from "./ui/tab-view/tab-view-navigation-tests";
216225
allTests["TAB-VIEW-NAVIGATION"] = tabViewNavigationTests;
217226

‎tests/app/ui/bottom-navigation/bottom-navigation-tests-new.ts‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { Image, Label, BottomNavigation, Builder, TabContentItem, TabStrip, TabStripItem } from "@nativescript/core/ui";
2+
import * as TKUnit from "../../tk-unit";
3+
4+
export function test_lowercase_declaration() {
5+
const root = Builder.parse(`
6+
<bottom-navigation>
7+
<tab-strip id="tab-strip">
8+
<tab-strip-item id="tab-strip-item">
9+
<image src="res://icon" id="tab-strip-item-image" />
10+
<label text="test" id="tab-strip-item-label" />
11+
</tab-strip-item>
12+
</tab-strip>
13+
<tab-content-item id="tab-content-item">
14+
<label text="test" id="tab-content-item-label" />
15+
</tab-content-item>
16+
</bottom-navigation>
17+
`);
18+
19+
const tabStrip = root.getViewById("tab-strip");
20+
const tabStripItem = root.getViewById("tab-strip-item");
21+
const tabStripItemImage = root.getViewById("tab-strip-item-image");
22+
const tabStripItemLabel = root.getViewById("tab-strip-item-label");
23+
const tabContentItem = root.getViewById("tab-content-item");
24+
const tabContentItemLabel = root.getViewById("tab-content-item-label");
25+
26+
TKUnit.assert(root instanceof BottomNavigation, "Expected result: BottomNavigation!; Actual result: " + root);
27+
TKUnit.assert(tabStrip instanceof TabStrip, "Expected result: TabStrip!; Actual result: " + tabStrip);
28+
TKUnit.assert(tabStripItem instanceof TabStripItem, "Expected result: TabStripItem!; Actual result: " + tabStripItem);
29+
TKUnit.assert(tabStripItemImage instanceof Image, "Expected result: Image!; Actual result: " + tabStripItemImage);
30+
TKUnit.assert(tabStripItemLabel instanceof Label, "Expected result: Label!; Actual result: " + tabStripItemLabel);
31+
TKUnit.assert(tabContentItem instanceof TabContentItem, "Expected result: TabContentItem!; Actual result: " + tabContentItem);
32+
TKUnit.assert(tabContentItemLabel instanceof Label, "Expected result: Label!; Actual result: " + tabContentItemLabel);
33+
}

‎tests/app/ui/tab-view/tab-view-tests-new.ts‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { Label, Builder, TabView, TabViewItem } from "@nativescript/core/ui";
2+
import * as TKUnit from "../../tk-unit";
3+
4+
export function test_lowercase_declaration() {
5+
const root = Builder.parse(`
6+
<tab-view>
7+
<tab-view-item id="tab-view-item">
8+
<label text="test" id="tab-view-item-label" />
9+
</tab-view-item>
10+
</tab-view>
11+
`);
12+
13+
const tabViewItem = root.getViewById("tab-view-item");
14+
const tabViewItemLabel = root.getViewById("tab-view-item-label");
15+
16+
TKUnit.assert(root instanceof TabView, "Expected result: TabView!; Actual result: " + root);
17+
TKUnit.assert(tabViewItem instanceof TabViewItem, "Expected result: TabViewItem!; Actual result: " + tabViewItem);
18+
TKUnit.assert(tabViewItemLabel instanceof Label, "Expected result: Label!; Actual result: " + tabViewItemLabel);
19+
}

‎tests/app/ui/tabs/tabs-tests-new.ts‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { Image, Label, Builder, TabContentItem, Tabs, TabStrip, TabStripItem } from "@nativescript/core/ui";
2+
import * as TKUnit from "../../tk-unit";
3+
4+
export function test_lowercase_declaration() {
5+
const root = Builder.parse(`
6+
<tabs>
7+
<tab-strip id="tab-strip">
8+
<tab-strip-item id="tab-strip-item">
9+
<image src="res://icon" id="tab-strip-item-image" />
10+
<label text="test" id="tab-strip-item-label" />
11+
</tab-strip-item>
12+
</tab-strip>
13+
<tab-content-item id="tab-content-item">
14+
<label text="test" id="tab-content-item-label" />
15+
</tab-content-item>
16+
</tabs>
17+
`);
18+
19+
const tabStrip = root.getViewById("tab-strip");
20+
const tabStripItem = root.getViewById("tab-strip-item");
21+
const tabStripItemImage = root.getViewById("tab-strip-item-image");
22+
const tabStripItemLabel = root.getViewById("tab-strip-item-label");
23+
const tabContentItem = root.getViewById("tab-content-item");
24+
const tabContentItemLabel = root.getViewById("tab-content-item-label");
25+
26+
TKUnit.assert(root instanceof Tabs, "Expected result: Tabs!; Actual result: " + root);
27+
TKUnit.assert(tabStrip instanceof TabStrip, "Expected result: TabStrip!; Actual result: " + tabStrip);
28+
TKUnit.assert(tabStripItem instanceof TabStripItem, "Expected result: TabStripItem!; Actual result: " + tabStripItem);
29+
TKUnit.assert(tabStripItemImage instanceof Image, "Expected result: Image!; Actual result: " + tabStripItemImage);
30+
TKUnit.assert(tabStripItemLabel instanceof Label, "Expected result: Label!; Actual result: " + tabStripItemLabel);
31+
TKUnit.assert(tabContentItem instanceof TabContentItem, "Expected result: TabContentItem!; Actual result: " + tabContentItem);
32+
TKUnit.assert(tabContentItemLabel instanceof Label, "Expected result: Label!; Actual result: " + tabContentItemLabel);
33+
}

0 commit comments

Comments
 (0)