Skip to content

Commit 311ad1a

Browse files
vankeisbvankeisb
committed
webtests
1 parent 89dfba1 commit 311ad1a

8 files changed

Lines changed: 333 additions & 85 deletions

File tree

‎samples/src/App.tsx‎

Lines changed: 62 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -24,18 +24,7 @@
2424
*/
2525

2626
import React from 'react';
27-
import {
28-
Cmd,
29-
Dispatcher,
30-
just,
31-
map,
32-
Maybe,
33-
maybeOf,
34-
noCmd,
35-
nothing,
36-
Sub,
37-
Task,
38-
} from 'tea-cup-core';
27+
import { Cmd, Dispatcher, just, map, Maybe, maybeOf, noCmd, nothing, Sub, Task } from 'tea-cup-core';
3928
import {
4029
DevTools,
4130
newUrl,
@@ -60,7 +49,7 @@ import * as TimeSample from './Samples/TimeSample';
6049
import * as EventsSample from './Samples/EventsSample';
6150
import * as SelectSample from './Samples/SelectSample';
6251
import * as PortsSample from './Samples/PortsSample';
63-
import { appSamplePorts } from "./Samples/PortsSample";
52+
import { appSamplePorts } from './Samples/PortsSample';
6453

6554
enum Tab {
6655
All,
@@ -367,7 +356,7 @@ function mapPortsSample(m: PortsSample.Msg): Msg {
367356
return {
368357
type: 'portsSample',
369358
child: m,
370-
}
359+
};
371360
}
372361

373362
function view(dispatch: Dispatcher<Msg>, model: Model) {
@@ -464,16 +453,16 @@ function viewTodos(dispatch: Dispatcher<Msg>, todoMvc: TodoMvc) {
464453
{active ? (
465454
<span>{label}</span>
466455
) : (
467-
<a
468-
href="#x"
469-
onClick={(e) => {
470-
e.preventDefault();
471-
dispatch({ type: 'tabClicked', tab: t });
472-
}}
473-
>
474-
{label}
475-
</a>
476-
)}
456+
<a
457+
href="#x"
458+
onClick={(e) => {
459+
e.preventDefault();
460+
dispatch({ type: 'tabClicked', tab: t });
461+
}}
462+
>
463+
{label}
464+
</a>
465+
)}
477466
</li>
478467
);
479468
}
@@ -485,46 +474,46 @@ function viewTodos(dispatch: Dispatcher<Msg>, todoMvc: TodoMvc) {
485474
{todos.length === 0 ? (
486475
<p>You have nothing to do ! Neat !!</p>
487476
) : (
488-
<div>
489-
<ul>
490-
{viewTab(Tab.All)}
491-
{viewTab(Tab.Open)}
492-
{viewTab(Tab.Closed)}
493-
</ul>
494-
<ul>
495-
{todos
496-
.filter((todo) => {
497-
switch (tab) {
498-
case Tab.All:
499-
return true;
500-
case Tab.Open:
501-
return !todo.done;
502-
case Tab.Closed:
503-
return todo.done;
504-
}
505-
return false;
506-
})
507-
.map((todo) => {
508-
const style = {
509-
textDecoration: todo.done ? 'line-through' : 'none',
510-
};
511-
return (
512-
<li key={todo.id} style={style}>
513-
<a
514-
href="#x"
515-
onClick={(e) => {
516-
e.preventDefault();
517-
dispatch(navigateTo(todoRoute(todo.id)));
518-
}}
519-
>
520-
{todo.text}
521-
</a>
522-
</li>
523-
);
524-
})}
525-
</ul>
526-
</div>
527-
)}
477+
<div>
478+
<ul>
479+
{viewTab(Tab.All)}
480+
{viewTab(Tab.Open)}
481+
{viewTab(Tab.Closed)}
482+
</ul>
483+
<ul>
484+
{todos
485+
.filter((todo) => {
486+
switch (tab) {
487+
case Tab.All:
488+
return true;
489+
case Tab.Open:
490+
return !todo.done;
491+
case Tab.Closed:
492+
return todo.done;
493+
}
494+
return false;
495+
})
496+
.map((todo) => {
497+
const style = {
498+
textDecoration: todo.done ? 'line-through' : 'none',
499+
};
500+
return (
501+
<li key={todo.id} style={style}>
502+
<a
503+
href="#x"
504+
onClick={(e) => {
505+
e.preventDefault();
506+
dispatch(navigateTo(todoRoute(todo.id)));
507+
}}
508+
>
509+
{todo.text}
510+
</a>
511+
</li>
512+
);
513+
})}
514+
</ul>
515+
</div>
516+
)}
528517
</div>
529518
);
530519
}
@@ -566,7 +555,6 @@ function viewSamples(dispatch: Dispatcher<Msg>, samples: Samples) {
566555
return (
567556
<div>
568557
{backToHome(dispatch)}
569-
<h1>Samples</h1>
570558
<p>
571559
This is the samples app for <code>react-tea-cup</code>.
572560
</p>
@@ -594,10 +582,14 @@ function viewSamples(dispatch: Dispatcher<Msg>, samples: Samples) {
594582
{SelectSample.view(map(dispatch, mapSelectSample), samples.select)}
595583
<h2>Ports</h2>
596584
{PortsSample.view(map(dispatch, mapPortsSample), samples.ports)}
597-
<button onClick={() => {
598-
// call ports without going through any update loop
599-
appSamplePorts.setCounter.send(0)
600-
}}>Reset using port</button>
585+
<button
586+
onClick={() => {
587+
// call ports without going through any update loop
588+
appSamplePorts.setCounter.send(0);
589+
}}
590+
>
591+
Reset using port
592+
</button>
601593
</div>
602594
);
603595
}
@@ -661,7 +653,7 @@ function update(msg: Msg, model: Model): [Model, Cmd<Msg>] {
661653
const macTime = TimeSample.update(msg.child, s.time);
662654
return [{ ...s, time: macTime[0] }, macTime[1].map(mapTimeSample)];
663655
});
664-
case "portsSample":
656+
case 'portsSample':
665657
return mapSample((s: Samples) => {
666658
const mac = PortsSample.update(msg.child, s.ports);
667659
return [{ ...s, ports: mac[0] }, mac[1].map(mapPortsSample)];

‎samples/src/Samples/Counter.tsx‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -42,10 +42,14 @@ export function init(): [Model, Cmd<Msg>] {
4242
// need this "dispatch" arg, so that you can emit Msgs
4343
export function view(dispatch: Dispatcher<Msg>, model: Model) {
4444
return (
45-
<div className="counter">
46-
<button onClick={(_) => dispatch({ type: 'dec' })}>-</button>
47-
<span>{model}</span>
48-
<button onClick={(_) => dispatch({ type: 'inc' })}>+</button>
45+
<div className="counter" id="sample-counter">
46+
<button id="counter-sub" onClick={(_) => dispatch({ type: 'dec' })}>
47+
-
48+
</button>
49+
<span id="counter-value">{model}</span>
50+
<button id="counter-add" onClick={(_) => dispatch({ type: 'inc' })}>
51+
+
52+
</button>
4953
</div>
5054
);
5155
}

‎samples/src/Samples/EventsSample.tsx‎

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -73,13 +73,19 @@ export function init(): [Model, Cmd<Msg>] {
7373

7474
export function view(dispatch: Dispatcher<Msg>, model: Model) {
7575
return (
76-
<div className="events">
77-
{model.clicked.map(viewMousePosition('Clicked')).withDefault(<div>Waiting for click ...</div>)}
76+
<span className="events" id="sample-events">
77+
{model.clicked
78+
.map(viewMousePosition('Clicked'))
79+
.withDefault(<div className="wait-for-click">Waiting for click ...</div>)}
7880
{model.moved.map(viewMousePosition('Moved')).withDefault(<div>Waiting for move ...</div>)}
7981
{model.scrolled.map(viewPosition('Scrolled')).withDefault(<div>Waiting for move ...</div>)}
80-
<div>resized left : {model.nbResizeLeft}</div>
81-
<div>resized right : {model.nbResizeRight}</div>
82-
</div>
82+
<div>
83+
resized left : <span id={'resized-left'}>{model.nbResizeLeft}</span>
84+
</div>
85+
<div>
86+
resized right : <span id={'resized-right'}>{model.nbResizeRight}</span>
87+
</div>
88+
</span>
8389
);
8490
}
8591

@@ -169,8 +175,10 @@ export function subscriptions(model: Model): Sub<Msg> {
169175
function viewMousePosition(title: string) {
170176
return (position: MousePosition) => {
171177
return (
172-
<div>
173-
<b>{title}: </b>
178+
<div className={'view-mouse-pos'} data-title={title}>
179+
<b>
180+
<span className={'vmp-title'}>{title}</span>:{' '}
181+
</b>
174182
{viewPosition('Position')(position.pos)}&nbsp;
175183
{viewPosition('Page')(position.page)}&nbsp;
176184
{viewPosition('Offset')(position.offset)}

‎samples/src/Samples/PortsSample.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,6 @@ export function init(): [Model, Cmd<Msg>] {
5353
export function view(dispatch: Dispatcher<Msg>, model: Model) {
5454
return (
5555
<div>
56-
<h2>Counter with ports</h2>
5756
<span>Value = {model}</span>
5857
<button onClick={() => dispatch({ tag: 'inc' })}>+</button>
5958
</div>

‎samples/src/Samples/Raf.tsx‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@ export function view(dispatch: Dispatcher<Msg>, model: Model) {
6060
<div>
6161
<div>
6262
<input
63+
id={'sample-raf'}
6364
type="text"
6465
value={model.animText}
6566
onChange={(e) =>
@@ -70,11 +71,17 @@ export function view(dispatch: Dispatcher<Msg>, model: Model) {
7071
}
7172
/>
7273
</div>
73-
<span>Time = {Math.round(model.t)}</span>
74+
<span>
75+
Time = <span id={'raf-time-1'}>{Math.round(model.t)}</span>
76+
</span>
7477
<br />
75-
<span>t2 = {Math.round(model.t2)}</span>
78+
<span>
79+
t2 = <span id={'raf-time-2'}>{Math.round(model.t2)}</span>
80+
</span>
7681
<br />
77-
<button onClick={(_) => dispatch({ type: 'toggle' })}>{model.started ? 'Stop' : 'Start'}</button>
82+
<button id="raf-start" onClick={(_) => dispatch({ type: 'toggle' })}>
83+
{model.started ? 'Stop' : 'Start'}
84+
</button>
7885
{fps}
7986
{anim}
8087
</div>

‎webtests/.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
target

0 commit comments

Comments
 (0)