Skip to content

Commit f246215

Browse files
author
Alexander Vakrilov
authored
Chrome devtools elements tab support for Android (NativeScript#4351)
* Enable chrome-devtools elemets tab * Trigger updates when property is chaned form native * Tslint fixes * Don't run dom-elemet tests in IOS * fix tests * Create package.json * Update package.json * domNode changed to field for performance
1 parent b7c61ca commit f246215

File tree

16 files changed

+896
-8
lines changed

16 files changed

+896
-8
lines changed

‎apps/app/devtools-app/app.css‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
.btn1 {
2+
background-color: lightgreen;
3+
color: coral;
4+
font-size: 20;
5+
font-family: monospace;
6+
}
7+
8+
.btn2 {
9+
background-color: coral;
10+
color: lightgreen;
11+
font-size: 24;
12+
font-family: serif;
13+
}

‎apps/app/devtools-app/app.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import * as application from "tns-core-modules/application";
2+
3+
// Needed only for build infrastructure
4+
application.setCssFileName("devtools-app/app.css");
5+
6+
application.start({ moduleName: "devtools-app/main-page" });

‎apps/app/devtools-app/main-page.ts‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import * as frame from "tns-core-modules/ui/frame";
2+
import { Label } from "tns-core-modules/ui/label";
3+
import { StackLayout } from "tns-core-modules/ui/layouts/stack-layout";
4+
// import { DOMNode } from "tns-core-modules/debugger/dom-node";
5+
6+
export function print(args) {
7+
// const node = new DOMNode(frame.topmost());
8+
// console.dir(node.toJSON());
9+
10+
// const btn = args.object.page.getViewById("btn");
11+
// btn.ensureDomNode();
12+
// console.dir(btn.domNode.getComputedProperties());
13+
}
14+
15+
let i = 0;
16+
export function add(args) {
17+
const container = args.object.page.getViewById("container");
18+
const lbl = new Label();
19+
lbl.text = "label " + i++;
20+
container.addChild(lbl);
21+
}
22+
23+
export function remove(args) {
24+
const container = <StackLayout>args.object.page.getViewById("container");
25+
const lbl = container.getChildAt(container.getChildrenCount() - 1);
26+
container.removeChild(lbl);
27+
}
28+
29+
export function navigate() {
30+
frame.topmost().navigate("gallery-app/main-page");
31+
}
32+
33+
export function change(args){
34+
args.object.text = "hi " + Math.random();
35+
36+
}

‎apps/app/devtools-app/main-page.xml‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<?xml version="1.0" encoding="UTF-8" ?>
2+
<Page navigatedTo="print">
3+
<GridLayout rows="* * *" columns="* * *">
4+
5+
<Button id="btn"
6+
customProp="custom"
7+
text="hi there"
8+
fontSize="30"
9+
row="1"
10+
col="1"
11+
color="red"
12+
backgroundColor="lightgreen"
13+
class="btn"
14+
tap="change"/>
15+
<Button text="class: btn1" class="btn1" row="1" col="0"/>
16+
<Button text="class: btn2" class="btn2" row="1" col="2"/>
17+
18+
<Button text="add" tap="add" />
19+
<Button text="remove" tap="remove" col="2" />
20+
21+
<Button text="move beach" tap="navigate" col="1" />
22+
<StackLayout colSpan="3" row="2" id="container">
23+
<TextField hint="hint" text="123" />
24+
<TextField hint="hint" text="456" />
25+
26+
27+
</StackLayout>
28+
</GridLayout>
29+
</Page>

0 commit comments

Comments
 (0)