diff --git a/README.md b/README.md index 2e3462d..3581cde 100644 --- a/README.md +++ b/README.md @@ -73,6 +73,14 @@ and then open [Logz.io](https://app.logz.io/#/dashboard/metrics). ## Changelong +1.1.9: + +- Add support to run a tests on different mobile devices + +1.1.8: + +- Add Option to choose device where need to run user flow + 1.1.7: - Add first invocation after cloud function was uploaded diff --git a/client/src/containers/EditCodeContainer/index.tsx b/client/src/containers/EditCodeContainer/index.tsx index e03124a..d877acf 100644 --- a/client/src/containers/EditCodeContainer/index.tsx +++ b/client/src/containers/EditCodeContainer/index.tsx @@ -2,11 +2,14 @@ import React, { FunctionComponent, useState } from 'react'; import styled from 'styled-components'; import CodeEditor from '../../components/CodeEditor'; -import EnvVariableWrapper from '../EnvVariableContainer'; +import EnvVariableContainer from '../EnvVariableContainer'; import Text from '../../components/Text'; import Select from '../../components/Select'; -import { availableCodeLanguages } from '../../utils/selectOptions'; +import { + availableCodeLanguages, + platformDevice, +} from '../../utils/selectOptions'; import Button from '../../components/Button'; import api from '../../utils/api'; @@ -19,7 +22,10 @@ const ContainerDiv = styled.div` max-width: 1280px; padding-bottom: 24px; `; - +const SideWrapper = styled.div` + width: 27%; + margin-right: 0; +`; const TopWrapper = styled.div` margin-bottom: 24px; display: flex; @@ -46,7 +52,12 @@ const SelectWrapper = styled.div` max-width: 215px; width: 100%; `; - +const SelectWrapperDevice = styled.div` + position: relative; + width: 100%; + margin-top: 10px; + margin-bottom: 30px; +`; const MainWrapper = styled.div` display: flex; justify-content: space-between; @@ -85,15 +96,19 @@ type EnvVariable = { interface IProps { uniqueKey: (isUnique: boolean) => void; codeSnippet: string; + testDevice: string; setCodeSnippet: (val: string) => void; setEnvVariable: (envVariable: EnvVariable[]) => void; + setTestDevice: (val: string) => void; } const EditCodeContainer: FunctionComponent = ({ uniqueKey, codeSnippet, + testDevice, setCodeSnippet, setEnvVariable, + setTestDevice, }) => { const [codeLanguage, setCodeLanguage] = useState('Playwright'); const [loading, setLoading] = useState(false); @@ -102,7 +117,9 @@ const EditCodeContainer: FunctionComponent = ({ const onChangeSelect = (option: string) => { setCodeLanguage(option); }; - + const onChangeSelectDevice = (option: string) => { + setTestDevice(option); + }; const startTestLocally = async () => { setTestStatus(''); if (!isCodeValid) { @@ -111,7 +128,7 @@ const EditCodeContainer: FunctionComponent = ({ } setLoading(true); - const response = await api.testLocal(codeSnippet); + const response = await api.testLocal(codeSnippet, testDevice); if (response!.error && response!.errorData) { setTestStatus(response!.errorData); @@ -157,10 +174,24 @@ const EditCodeContainer: FunctionComponent = ({ setCodeSnippet={setCodeSnippet} codeSnippet={codeSnippet} /> - + + Select Device + + Select the device on which you would like to execute + the test. + + +