Skip to content

Commit be45418

Browse files
committed
Working on linkFiber
1 parent 32dc2b3 commit be45418

File tree

16 files changed

+811
-185
lines changed

16 files changed

+811
-185
lines changed

demo-app/src/client/Components/Increment.tsx

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
11
import React, { useState } from 'react';
2-
import Box from './Box';
3-
import { BoardText } from '../../types';
4-
import { Function } from 'lodash';
52
function Increment() {
63
const [count, setCount] = useState(0);
74
return (

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,7 @@
138138
"jscharting-react": "^1.2.1",
139139
"prettier": "2.8.4",
140140
"puppeteer": "^14.3.0",
141+
"react-devtools-core": "^4.27.3",
141142
"sass": "^1.26.10",
142143
"sass-loader": "^7.3.1",
143144
"sinon-chrome": "^3.0.1",
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import React from 'react';
2+
3+
export default class IncrementClass extends React.Component {
4+
constructor(props) {
5+
super(props);
6+
this.state = { count: 0 };
7+
this.handleClick = this.handleClick.bind(this);
8+
}
9+
10+
handleClick() {
11+
this.setState({ count: this.state.count + 1 });
12+
}
13+
14+
render() {
15+
return (
16+
<div>
17+
<button className='increment' onClick={this.handleClick}>
18+
You clicked me {this.state.count} times.
19+
</button>
20+
</div>
21+
);
22+
}
23+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React, { useState } from 'react';
2+
function Increment() {
3+
const [count, setCount] = useState(0);
4+
return (
5+
<div>
6+
<button className='increment' onClick={() => setCount(count + 1)}>
7+
You clicked me {count} times.
8+
</button>
9+
</div>
10+
);
11+
}
12+
13+
export default Increment;

src/backend/__tests__/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,6 @@
66
<title>Testing LinkFiber</title>
77
</head>
88
<body>
9-
9+
<main id="root"></main>
1010
</body>
1111
</html>
Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
import Tree from '../models/tree';
2+
import routes from '../models/routes';
3+
import { ComponentData, Fiber } from '../types/backendTypes';
4+
import { FunctionComponent, ClassComponent, HostRoot } from '../types/backendTypes';
5+
import IncrementFunc from './IncrementFunc';
6+
import IncrementClass from './IncrementClass';
7+
8+
export const root: Fiber = {
9+
tag: HostRoot,
10+
elementType: null,
11+
sibling: null,
12+
stateNode: null,
13+
child: null,
14+
memoizedState: null,
15+
memoizedProps: null,
16+
actualDuration: 1,
17+
actualStartTime: 2,
18+
selfBaseDuration: 3,
19+
treeBaseDuration: 4,
20+
_debugHookTypes: null,
21+
};
22+
export const rootPayload = new Tree('root', 'root');
23+
rootPayload.route = routes.addRoute('http://localhost/');
24+
25+
export const functionalComponent: Fiber = {
26+
tag: FunctionComponent,
27+
elementType: IncrementFunc,
28+
sibling: null,
29+
stateNode: null,
30+
child: null,
31+
memoizedState: {
32+
memoizeState: 0,
33+
queue: {
34+
dispatch: function (newState) {
35+
this.memoizedState = newState;
36+
},
37+
},
38+
},
39+
memoizedProps: {},
40+
actualDuration: 1,
41+
actualStartTime: 2,
42+
selfBaseDuration: 3,
43+
treeBaseDuration: 4,
44+
_debugHookTypes: ['useState'],
45+
};
46+
47+
export const classComponent: Fiber = {
48+
tag: ClassComponent,
49+
elementType: IncrementClass,
50+
sibling: null,
51+
stateNode: {
52+
state: { count: 0 },
53+
setState: function (newState) {
54+
this.state = newState;
55+
},
56+
},
57+
child: null,
58+
memoizedState: {
59+
count: 0,
60+
},
61+
memoizedProps: {},
62+
actualDuration: 1,
63+
actualStartTime: 2,
64+
selfBaseDuration: 3,
65+
treeBaseDuration: 4,
66+
_debugHookTypes: null,
67+
};
68+
69+
export const classPayload = new Tree('root', 'root');
70+
classPayload.route = rootPayload.route;
71+
72+
// Append increment child to root
73+
const componentData: ComponentData = {
74+
actualDuration: 1,
75+
actualStartTime: 2,
76+
selfBaseDuration: 3,
77+
treeBaseDuration: 4,
78+
context: {},
79+
hooksIndex: null,
80+
hooksState: null,
81+
index: 0,
82+
props: {},
83+
state: { count: 0 },
84+
};
85+
classPayload.addChild({ count: 0 }, 'IncrementClass', componentData, null);
86+
87+
export const updateClassPayload = new Tree('root', 'root');
88+
updateClassPayload.route = rootPayload.route;
89+
updateClassPayload.addChild({ count: 2 }, 'IncrementClass', { ...componentData, count: 2 }, null);

0 commit comments

Comments
 (0)