Skip to content

Commit 97b51f9

Browse files
dev-sebdev-seb
committed
Some fixes after running yarn test
1 parent 08eb3ab commit 97b51f9

File tree

7 files changed

+75
-80
lines changed

7 files changed

+75
-80
lines changed

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
coverage
22
node_modules
33
dist
4+
.idea

‎packages/react-native-web/src/exports/BackHandler/index.js

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,14 @@ function emptyFunction() {}
1212

1313
const BackHandler = {
1414
exitApp: emptyFunction,
15-
addEventListener(event, callback) {
15+
/**
16+
* Listen to "hardwareBackPress" event
17+
*
18+
* @param event
19+
* @param callback
20+
* @returns {{remove: remove}}
21+
*/
22+
addEventListener(event: string, callback: Function) {
1623
document.addEventListener(event, callback);
1724
return {
1825
remove: () => {

‎packages/react-native-web/src/exports/Platform/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const Platform = {
1818
return false;
1919
},
2020
get isTV(): boolean {
21-
return process.env.REACT_APP_IS_TV === "true";
21+
return process.env.REACT_APP_IS_TV === 'true';
2222
}
2323
};
2424

‎packages/react-native-web/src/exports/TVEventHandler/index.js

Lines changed: 10 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
class TVEventHandler {
2-
32
constructor() {
43
this.component = null;
54
this.callback = null;
@@ -8,24 +7,18 @@ class TVEventHandler {
87
enable(component, callback) {
98
this.component = component;
109
this.callback = callback;
11-
document.addEventListener(
12-
'onHWKeyEvent',
13-
this.onHWKeyEvent.bind(this)
14-
);
10+
document.addEventListener('onHWKeyEvent', this.onHWKeyEvent.bind(this));
1511
}
1612

1713
disable() {
18-
document.removeEventListener(
19-
'onHWKeyEvent',
20-
this.onHWKeyEvent
21-
);
14+
document.removeEventListener('onHWKeyEvent', this.onHWKeyEvent);
2215
}
2316

2417
onHWKeyEvent(event) {
2518
if (this.callback) {
2619
if (event && event.detail) {
2720
const tvEvent = event.detail.tvEvent;
28-
if(tvEvent) {
21+
if (tvEvent) {
2922
this.callback(this.component, tvEvent);
3023
}
3124
}
@@ -34,15 +27,16 @@ class TVEventHandler {
3427

3528
static dispatchEvent(tvEvent) {
3629
// Dispatch tvEvent through onHWKeyEvent
37-
const hwKeyEvent = new CustomEvent("onHWKeyEvent", {
38-
detail: {tvEvent: tvEvent},
30+
// eslint-disable-next-line no-undef
31+
const hwKeyEvent = new CustomEvent('onHWKeyEvent', {
32+
detail: { tvEvent: tvEvent }
3933
});
4034
document.dispatchEvent(hwKeyEvent);
4135
}
4236

4337
static getTVEvent(event) {
4438
// create tv event
45-
let tvEvent = {
39+
const tvEvent = {
4640
eventKeyAction: -1,
4741
eventType: '',
4842
tag: ''
@@ -78,11 +72,12 @@ class TVEventHandler {
7872
case 'Menu':
7973
tvEvent.eventType = 'menu';
8074
break;
75+
default:
76+
tvEvent.eventType = '';
8177
}
8278
if (event.type === 'keydown') {
8379
tvEvent.eventKeyAction = 0;
84-
}
85-
else if (event.type === 'keyup') {
80+
} else if (event.type === 'keyup') {
8681
tvEvent.eventKeyAction = 1;
8782
}
8883
}
@@ -96,7 +91,6 @@ class TVEventHandler {
9691
}
9792
return tvEvent;
9893
}
99-
10094
}
10195

10296
export default TVEventHandler;

‎packages/react-native-web/src/exports/Touchable/index.js

Lines changed: 22 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ import Position from './Position';
1818
import React from 'react';
1919
import UIManager from '../UIManager';
2020
import View from '../View';
21-
import Platform from "../Platform";
22-
import TVEventHandler from "../TVEventHandler";
21+
import Platform from '../Platform';
22+
import TVEventHandler from '../TVEventHandler';
2323

2424
type Event = Object;
2525
type PressEvent = Object;
@@ -382,7 +382,6 @@ const TouchableMixin = {
382382
};
383383
this._touchableNode.addEventListener('blur', this._touchableBlurListener);
384384
}
385-
386385
},
387386

388387
/**
@@ -405,9 +404,9 @@ const TouchableMixin = {
405404
* `this.state.touchable`.
406405
*/
407406
touchableGetInitialState: function() {
407+
this._isFocused = false;
408408
return {
409-
touchable: { touchState: undefined, responderID: null },
410-
focused: false
409+
touchable: { touchState: undefined, responderID: null }
411410
};
412411
},
413412

@@ -570,7 +569,7 @@ const TouchableMixin = {
570569
* using `Touchable.Mixin.withoutDefaultFocusAndBlur`.
571570
*/
572571
touchableHandleFocus: function(e: Event) {
573-
this.state.focused = true;
572+
this._isFocused = true;
574573
this.props.onFocus && this.props.onFocus(e);
575574
},
576575

@@ -583,7 +582,7 @@ const TouchableMixin = {
583582
* `Touchable.Mixin.withoutDefaultFocusAndBlur`.
584583
*/
585584
touchableHandleBlur: function(e: Event) {
586-
this.state.focused = false;
585+
this._isFocused = false;
587586
this.props.onBlur && this.props.onBlur(e);
588587
},
589588

@@ -879,35 +878,32 @@ const TouchableMixin = {
879878
// delays and longPress)
880879
touchableHandleKeyEvent: function(e: Event) {
881880
const { type, key } = e;
882-
if(Platform.isTV) {
881+
if (Platform.isTV) {
883882
// Get tvEvent
884883
const tvEvent = TVEventHandler.getTVEvent(e);
885884
// Dispatch 'select' tvEvent to component
886-
if(tvEvent.eventType === 'select') {
885+
if (tvEvent.eventType === 'select') {
887886
this.touchableHandlePress(tvEvent);
888887
}
889888
// Dispatch tvEvent to all listeners
890889
TVEventHandler.dispatchEvent(tvEvent);
891890
// Handle next focus
892-
if(this._touchableNode) {
891+
if (this._touchableNode) {
893892
let nextFocusID = '';
894893
// Check nextFocus* properties
895-
if(this._touchableNode.hasAttribute("nextFocusUp") && key === 'ArrowUp') {
896-
nextFocusID = this._touchableNode.getAttribute("nextFocusUp");
897-
}
898-
else if(this._touchableNode.hasAttribute("nextFocusRight") && key === 'ArrowRight') {
899-
nextFocusID = this._touchableNode.getAttribute("nextFocusRight");
900-
}
901-
else if(this._touchableNode.hasAttribute("nextFocusDown") && key === 'ArrowDown') {
902-
nextFocusID = this._touchableNode.getAttribute("nextFocusDown");
903-
}
904-
else if(this._touchableNode.hasAttribute("nextFocusLeft") && key === 'ArrowLeft') {
905-
nextFocusID = this._touchableNode.getAttribute("nextFocusLeft");
894+
if (this._touchableNode.hasAttribute('nextFocusUp') && key === 'ArrowUp') {
895+
nextFocusID = this._touchableNode.getAttribute('nextFocusUp');
896+
} else if (this._touchableNode.hasAttribute('nextFocusRight') && key === 'ArrowRight') {
897+
nextFocusID = this._touchableNode.getAttribute('nextFocusRight');
898+
} else if (this._touchableNode.hasAttribute('nextFocusDown') && key === 'ArrowDown') {
899+
nextFocusID = this._touchableNode.getAttribute('nextFocusDown');
900+
} else if (this._touchableNode.hasAttribute('nextFocusLeft') && key === 'ArrowLeft') {
901+
nextFocusID = this._touchableNode.getAttribute('nextFocusLeft');
906902
}
907-
if(nextFocusID && nextFocusID !== '') {
903+
if (nextFocusID && nextFocusID !== '') {
908904
// Get DOM element
909905
const element = document.getElementById(nextFocusID);
910-
if(element && element.tabIndex >= 0) {
906+
if (element && element.tabIndex >= 0) {
911907
// Force focus
912908
element.focus();
913909
// Stop event propagation
@@ -916,8 +912,9 @@ const TouchableMixin = {
916912
}
917913
}
918914
// Trigger Hardware Back Press for Back/Escape event keys
919-
if(type === 'keydown' && (key === 'Back' || key === 'Escape')) {
920-
const hwKeyEvent = new CustomEvent("hardwareBackPress", {});
915+
if (type === 'keydown' && (key === 'Back' || key === 'Escape')) {
916+
// eslint-disable-next-line no-undef
917+
const hwKeyEvent = new CustomEvent('hardwareBackPress', {});
921918
document.dispatchEvent(hwKeyEvent);
922919
}
923920
}

‎packages/react-native-web/src/exports/TouchableHighlight/index.js

Lines changed: 13 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import Touchable from '../Touchable';
2121
import View from '../View';
2222
import UIManager from '../UIManager';
2323
import Platform from '../Platform';
24-
import TVEventHandler from "../TVEventHandler";
24+
import TVEventHandler from '../TVEventHandler';
2525

2626
type Event = Object;
2727
type PressEvent = Object;
@@ -174,7 +174,7 @@ const TouchableHighlight = ((createReactClass({
174174
this._isMounted = true;
175175
ensurePositiveDelayProps(this.props);
176176
// Focus component
177-
if(Platform.isTV && this.props.hasTVPreferredFocus === true) {
177+
if (Platform.isTV && this.props.hasTVPreferredFocus === true) {
178178
UIManager.focus(findNodeHandle(this));
179179
}
180180
},
@@ -199,7 +199,7 @@ const TouchableHighlight = ((createReactClass({
199199
* Set focus to current element
200200
*/
201201
setTVPreferredFocus(hasTVPreferredFocus) {
202-
if(Platform.isTV && hasTVPreferredFocus === true) {
202+
if (Platform.isTV && hasTVPreferredFocus === true) {
203203
UIManager.focus(findNodeHandle(this));
204204
}
205205
},
@@ -223,8 +223,8 @@ const TouchableHighlight = ((createReactClass({
223223
},
224224

225225
touchableHandleFocus: function(e: Event) {
226-
if(Platform.isTV) {
227-
this.state.focused = true;
226+
if (Platform.isTV) {
227+
this._isFocused = true;
228228
// Keep underlay visible
229229
this._showUnderlay();
230230
// Get tvEvent
@@ -233,15 +233,14 @@ const TouchableHighlight = ((createReactClass({
233233
this.props.onFocus && this.props.onFocus(tvEvent);
234234
// Dispatch tvEvent to all listeners
235235
TVEventHandler.dispatchEvent(tvEvent);
236-
}
237-
else {
236+
} else {
238237
this.props.onFocus && this.props.onFocus(e);
239238
}
240239
},
241240

242241
touchableHandleBlur: function(e: Event) {
243-
if(Platform.isTV) {
244-
this.state.focused = false;
242+
if (Platform.isTV) {
243+
this._isFocused = false;
245244
// Hide underlay
246245
this._hideUnderlay();
247246
// Get tvEvent
@@ -250,8 +249,7 @@ const TouchableHighlight = ((createReactClass({
250249
this.props.onBlur && this.props.onBlur(tvEvent);
251250
// Dispatch tvEvent to all listeners
252251
TVEventHandler.dispatchEvent(tvEvent);
253-
}
254-
else {
252+
} else {
255253
this.props.onBlur && this.props.onBlur(e);
256254
}
257255
},
@@ -305,7 +303,7 @@ const TouchableHighlight = ((createReactClass({
305303
_hideUnderlay: function() {
306304
clearTimeout(this._hideTimeout);
307305
this._hideTimeout = null;
308-
if(Platform.isTV && this.state.focused) {
306+
if (Platform.isTV && this._isFocused) {
309307
return;
310308
}
311309
if (this.props.testOnly_pressed) {
@@ -339,14 +337,14 @@ const TouchableHighlight = ((createReactClass({
339337
accessibilityRole={this.props.accessibilityRole}
340338
accessibilityState={this.props.accessibilityState}
341339
accessible={this.props.accessible !== false}
340+
hasTVPreferredFocus={this.props.hasTVPreferredFocus}
342341
hitSlop={this.props.hitSlop}
343342
nativeID={this.props.nativeID}
344-
onKeyDown={this.touchableHandleKeyEvent}
345343
//isTVSelectable={true}
346344
//tvParallaxProperties={this.props.tvParallaxProperties}
347-
hasTVPreferredFocus={this.props.hasTVPreferredFocus}
348-
onFocus={this.touchableHandleFocus}
349345
onBlur={this.touchableHandleBlur}
346+
onFocus={this.touchableHandleFocus}
347+
onKeyDown={this.touchableHandleKeyEvent}
350348
//nextFocusDown={this.props.nextFocusDown}
351349
//nextFocusForward={this.props.nextFocusForward}
352350
//nextFocusLeft={this.props.nextFocusLeft}

0 commit comments

Comments
 (0)