From adec8e6438a5216bdd6c39de4cb47b3888fdd109 Mon Sep 17 00:00:00 2001 From: paweldomas Date: Wed, 18 Apr 2018 13:06:04 -0500 Subject: [PATCH] ref(TestHint): render only in test mode Adds the logic to render TestHint only when the test mode is enabled in order to be able to put independent TestHints in other places than the TestConnectionInfo component. --- .../testing/components/AbstractTestHint.js | 32 +++++++++++++++++++ .../testing/components/TestConnectionInfo.js | 6 ++-- .../testing/components/TestHint.android.js | 10 +++++- .../base/testing/components/TestHint.ios.js | 10 +++++- react/features/base/testing/functions.js | 15 +++++++++ react/features/base/testing/index.js | 1 + 6 files changed, 68 insertions(+), 6 deletions(-) create mode 100644 react/features/base/testing/functions.js diff --git a/react/features/base/testing/components/AbstractTestHint.js b/react/features/base/testing/components/AbstractTestHint.js index 0544a1bca..183582cfe 100644 --- a/react/features/base/testing/components/AbstractTestHint.js +++ b/react/features/base/testing/components/AbstractTestHint.js @@ -1,5 +1,7 @@ /* @flow */ +import { isTestModeEnabled } from '../functions'; + /** * Describes the {@link TestHint}'s properties. * @@ -10,6 +12,13 @@ */ export type TestHintProps = { + /** + * The indicator which determines whether the test mode is enabled. + * {@link TestHint} components are rendered only if this flag is set to + * {@code true}. + */ + _testModeEnabled: boolean, + /** * The test hint's identifier string. Must be unique in the app instance * scope. @@ -21,3 +30,26 @@ export type TestHintProps = { */ value: string } + +/** + * Maps (parts of) the redux state to {@link TestHint}'s React {@code Component} + * props. + * + * @param {Object} state - The redux store/state. + * @private + * @returns {{ + * _testModeEnabled: boolean + * }} + */ +export function _mapStateToProps(state: Object) { + return { + + /** + * The indicator which determines whether the test mode is enabled. + * + * @protected + * @type {boolean} + */ + _testModeEnabled: isTestModeEnabled(state) + }; +} diff --git a/react/features/base/testing/components/TestConnectionInfo.js b/react/features/base/testing/components/TestConnectionInfo.js index 088222f40..6d4a61b63 100644 --- a/react/features/base/testing/components/TestConnectionInfo.js +++ b/react/features/base/testing/components/TestConnectionInfo.js @@ -11,6 +11,7 @@ import { getLocalParticipant } from '../../participants'; import { statsEmitter } from '../../../connection-indicator'; import { TestHint } from './index'; +import { isTestModeEnabled } from '../functions'; /** * Defines the TestConnectionInfo's properties. @@ -209,14 +210,11 @@ function _mapStateToProps(state) { = Boolean(state['features/base/conference'].conference); const localParticipant = getLocalParticipant(state); - const testingConfig = state['features/base/config'].testing; - const testMode = Boolean(testingConfig && testingConfig.testMode); - return { _conferenceConnectionState: state['features/testing'].connectionState, _conferenceJoinedState: conferenceJoined.toString(), _localUserId: localParticipant && localParticipant.id, - _testMode: testMode + _testMode: isTestModeEnabled(state) }; } diff --git a/react/features/base/testing/components/TestHint.android.js b/react/features/base/testing/components/TestHint.android.js index e1f1c59e5..7d3c02591 100644 --- a/react/features/base/testing/components/TestHint.android.js +++ b/react/features/base/testing/components/TestHint.android.js @@ -1,9 +1,11 @@ /* @flow */ import React, { Component } from 'react'; +import { connect } from 'react-redux'; import { Text } from 'react-native'; import type { TestHintProps } from './AbstractTestHint'; +import { _mapStateToProps } from './AbstractTestHint'; /** * The Android version of TestHint. It will put the identifier, @@ -22,7 +24,7 @@ import type { TestHintProps } from './AbstractTestHint'; * the TestHint class is to be the abstraction layer which masks the problem by * exposing id and value properties. */ -export default class TestHint extends Component { +class TestHint extends Component { /** * Renders the test hint on Android. @@ -30,6 +32,10 @@ export default class TestHint extends Component { * @returns {ReactElement} */ render() { + if (!this.props._testModeEnabled) { + return null; + } + return ( { this.props.value } @@ -37,3 +43,5 @@ export default class TestHint extends Component { ); } } + +export default connect(_mapStateToProps)(TestHint); diff --git a/react/features/base/testing/components/TestHint.ios.js b/react/features/base/testing/components/TestHint.ios.js index b4158bec2..c7353ee20 100644 --- a/react/features/base/testing/components/TestHint.ios.js +++ b/react/features/base/testing/components/TestHint.ios.js @@ -1,9 +1,11 @@ /* @flow */ import React, { Component } from 'react'; +import { connect } from 'react-redux'; import { Text } from 'react-native'; import type { TestHintProps } from './AbstractTestHint'; +import { _mapStateToProps } from './AbstractTestHint'; /** * This is the iOS version of the TestHint. @@ -12,13 +14,17 @@ import type { TestHintProps } from './AbstractTestHint'; * files to understand what a test hint is and why different iOS and Android * components are necessary. */ -export default class TestHint extends Component { +class TestHint extends Component { /** * Renders the test hint on Android. * * @returns {ReactElement} */ render() { + if (!this.props._testModeEnabled) { + return null; + } + return ( { ); } } + +export default connect(_mapStateToProps)(TestHint); diff --git a/react/features/base/testing/functions.js b/react/features/base/testing/functions.js new file mode 100644 index 000000000..2ee2965e3 --- /dev/null +++ b/react/features/base/testing/functions.js @@ -0,0 +1,15 @@ +// @flow + +/** + * Indicates whether the test mode is enabled. When it's enabled + * {@link TestHint} and other components from the testing package will be + * rendered in various places across the app to help with automatic testing. + * + * @param {Object} state - The redux store state. + * @returns {boolean} + */ +export function isTestModeEnabled(state: Object): boolean { + const testingConfig = state['features/base/config'].testing; + + return Boolean(testingConfig && testingConfig.testMode); +} diff --git a/react/features/base/testing/index.js b/react/features/base/testing/index.js index daaa5d02a..65787823f 100644 --- a/react/features/base/testing/index.js +++ b/react/features/base/testing/index.js @@ -1,4 +1,5 @@ export * from './components'; +export * from './functions'; import './middleware'; import './reducer';