diff --git a/src/client/components/composer/NewRequest/TestEntryForm.jsx b/src/client/components/composer/NewRequest/TestEntryForm.jsx index dafa3a2dd..522fd7765 100644 --- a/src/client/components/composer/NewRequest/TestEntryForm.jsx +++ b/src/client/components/composer/NewRequest/TestEntryForm.jsx @@ -1,79 +1,73 @@ +/* eslint-disable jsx-a11y/no-static-element-interactions */ +/* eslint-disable jsx-a11y/click-events-have-key-events */ import React, { useState } from "react"; import WWWForm from "./WWWForm.jsx"; import BodyTypeSelect from "./BodyTypeSelect.jsx"; import JSONTextArea from "./JSONTextArea.jsx"; -import RawBodyTypeSelect from "./RawBodyTypeSelect.jsx" -import JSONPrettify from "./JSONPrettify.jsx" -import TextCodeAreaEditable from "./TextCodeAreaEditable.jsx" +import RawBodyTypeSelect from "./RawBodyTypeSelect.jsx"; +import JSONPrettify from "./JSONPrettify.jsx"; +import TextCodeAreaEditable from "./TextCodeAreaEditable.jsx"; import dropDownArrow from "../../../../assets/icons/caret-down-tests.svg"; import dropDownArrowUp from "../../../../assets/icons/caret-up-tests.svg"; import { isAbsolute, relative } from "path"; +import RestTestSnippetsContainer from "./TestSnippets/RestTestSnippetsContainer"; const TestEntryForm = (props) => { - const { - testContent, - setNewTestContent - } = props; + const { testContent, setNewTestContent } = props; const [showTests, setShowTests] = useState(false); const handleShowTests = () => setShowTests(!showTests); return ( -
+
+
{ - handleShowTests(); - }} + onClick={handleShowTests} > - {showTests === true && - <> - Hide Tests - - - - - } - {showTests === false && - <> - View Tests - - - - - } - - -
- {showTests === true && -
- { - setNewTestContent(value); - }} - /> + {showTests === true && ( + <> + Hide Tests + + + + + )} + {showTests === false && ( + <> + View Tests + + + + + )}
- } + {showTests === true && ( +
+ { + setNewTestContent(value); + }} + /> +
+ )}
- - - - - - - ); }; diff --git a/src/client/components/composer/NewRequest/TestSnippets/RestTestSnippets.jsx b/src/client/components/composer/NewRequest/TestSnippets/RestTestSnippets.jsx new file mode 100644 index 000000000..6a7311d20 --- /dev/null +++ b/src/client/components/composer/NewRequest/TestSnippets/RestTestSnippets.jsx @@ -0,0 +1,36 @@ +/* eslint-disable jsx-a11y/no-static-element-interactions */ +/* eslint-disable jsx-a11y/click-events-have-key-events */ +import React from "react"; + +export default function RestTestSnippets(props) { + const { setNewTestContent, setShowTests } = props; + + const snippets = { + "Status code: Code is 200": + "assert.strictEqual(response.status, 200, 'response is 200')", + + "Access the cookies from the response object": + "assert.exists(response.cookies, 'cookies exists on response object')", + }; + + const handleClickOne = () => { + setShowTests(true); + setNewTestContent(snippets["Status code: Code is 200"]); + }; + + const handleClickTwo = () => { + setShowTests(true); + setNewTestContent(snippets["Access the cookies from the response object"]); + }; + + return ( +
+ Status code: Code is 200; +
+ + Access the cookies from the response object + + ; +
+ ); +} diff --git a/src/client/components/composer/NewRequest/TestSnippets/RestTestSnippetsContainer.jsx b/src/client/components/composer/NewRequest/TestSnippets/RestTestSnippetsContainer.jsx new file mode 100644 index 000000000..d8e13da28 --- /dev/null +++ b/src/client/components/composer/NewRequest/TestSnippets/RestTestSnippetsContainer.jsx @@ -0,0 +1,64 @@ +/* eslint-disable jsx-a11y/no-static-element-interactions */ +/* eslint-disable jsx-a11y/click-events-have-key-events */ +import React, { useState } from "react"; +import dropDownArrow from "../../../../../assets/icons/caret-down-tests.svg"; + +import dropDownArrowUp from "../../../../../assets/icons/caret-up-tests.svg"; + +import RestTestSnippets from "./RestTestSnippets"; + +export default function RestTestSnippetsContainer(props) { + console.log("propsssss=>", props); + const { setShowTests, testContent, setNewTestContent } = props; + const [showSnippets, setShowSnippets] = useState(false); + + const handleShowSnippets = () => { + setShowSnippets(!showSnippets); + }; + return ( +
+
+ {showSnippets === true && ( + <> + Test Snippets + + + + + )} + + {showSnippets === false && ( + <> + Test Snippets + + + + + )} +
+ + {showSnippets === true && ( +
+ +
+ )} +
+ ); +} diff --git a/src/client/components/composer/NewRequest/TextCodeAreaEditable.jsx b/src/client/components/composer/NewRequest/TextCodeAreaEditable.jsx index 26f6289a8..2af536a01 100644 --- a/src/client/components/composer/NewRequest/TextCodeAreaEditable.jsx +++ b/src/client/components/composer/NewRequest/TextCodeAreaEditable.jsx @@ -1,18 +1,18 @@ import { POINT_CONVERSION_UNCOMPRESSED } from "constants"; import React, { useState, useEffect, useRef } from "react"; -import {UnControlled as CodeMirror} from 'react-codemirror2'; -import 'codemirror/theme/neat.css'; +import { UnControlled as CodeMirror } from "react-codemirror2"; +import "codemirror/theme/neat.css"; - -export default function TextCodeAreaEditable ({ value, mode, onChange, theme }) { +export default function TextCodeAreaEditable({ value, mode, onChange, theme }) { + console.log("value=>", value, "mode=>", mode, "theme=>", theme); return ( -
+
); -} \ No newline at end of file +} diff --git a/src/client/components/composer/RestContainer.jsx b/src/client/components/composer/RestContainer.jsx index 0d176c44a..c2528d58a 100644 --- a/src/client/components/composer/RestContainer.jsx +++ b/src/client/components/composer/RestContainer.jsx @@ -150,7 +150,6 @@ export default function RestContainer({ minimized: false, tab: currentTab, }; - console.log("reqRes--->", reqRes); } // add request to history diff --git a/src/client/components/display/WebSocketMessage.tsx b/src/client/components/display/WebSocketMessage.tsx index 4023e661d..af6694b3f 100644 --- a/src/client/components/display/WebSocketMessage.tsx +++ b/src/client/components/display/WebSocketMessage.tsx @@ -32,6 +32,7 @@ const WebSocketMessage:React.SFC = ({ console.log('Data=>>>> ',data) console.log('type of data', typeof data) + return (
@@ -42,6 +43,7 @@ console.log('type of data', typeof data) typeof data==='object'? + //decode buffer to dataURI img :
{data}
diff --git a/src/client/components/display/WebSocketWindow.tsx b/src/client/components/display/WebSocketWindow.tsx index a15ca5423..4ca738ae2 100644 --- a/src/client/components/display/WebSocketWindow.tsx +++ b/src/client/components/display/WebSocketWindow.tsx @@ -11,6 +11,7 @@ const { api } = window; const WebSocketWindow :React.SFC = ({ content, outgoingMessages, incomingMessages, connection }) => { const [inputMessage, setInputMessage] = useState(''); + const [showWarning, setShowWarning] =useState(false) //updates the outgoing message when it changes const updateOutgoingMessage = (value: any) => { @@ -28,6 +29,13 @@ const WebSocketWindow :React.SFC = ({ content, outgoingMes const file = event.target.files[0] console.log('file===>',file) + console.log('size==>', file.size) + file.size>100000 ? + setShowWarning(true): + setShowWarning(false) + + + //const imageSrc = URL.createObjectURL(file) const dataURL = (file:any) => new Promise((resolve, reject) => { @@ -38,6 +46,7 @@ const WebSocketWindow :React.SFC = ({ content, outgoingMes }); const data:any = await dataURL(file); + // const buffer = Buffer.from(data, "utf8"); // console.log(buffer) @@ -120,6 +129,11 @@ const WebSocketWindow :React.SFC = ({ content, outgoingMes > Send image + + + {showWarning? +

file size is large, may cause errors

: null} +
{/* only show the ws messages when connection is open */} {connection === "open" && ( diff --git a/test/pageObjects/ComposerObj.js b/test/pageObjects/ComposerObj.js index 404936b93..5e6bba8b3 100644 --- a/test/pageObjects/ComposerObj.js +++ b/test/pageObjects/ComposerObj.js @@ -49,13 +49,13 @@ class ComposerObj { return app.client.$("button=Add New Request"); } - // get closeConnectionBtn() { - // return app.client.$("button=Close Connection"); - // } + get closeConnectionBtn() { + return app.client.$("button=Close Connection"); + } - // get reopenConnectionBtn() { - // return app.client.$("button=Re-Open Connection"); - // } + get reopenConnectionBtn() { + return app.client.$("button=Re-Open Connection"); + } get testScriptCode() { const codeMirror = app.client.$("#test-script-entry"); diff --git a/test/subSuites/websocketTest.js b/test/subSuites/websocketTest.js index 21c3809ee..58b3340da 100644 --- a/test/subSuites/websocketTest.js +++ b/test/subSuites/websocketTest.js @@ -77,17 +77,65 @@ module.exports = () => { } }); - // it("it should send and receive images to public echo test", async()=>{ + it("it should send and receive images to public echo test", async () => { + try { + // select web sockets + // await composerObj.selectedNetwork.click(); + // await app.client.$("a=WEB SOCKETS").click(); - //}); + // type in url + // await composerObj.url.setValue("wss://echo.websocket.org"); - it("it should be able to close and re-open connection", async () => { - try { - await composerObj.closeConnectonBtn.click(); - await composerObj.reopenConnectionBtn.click(); + //await addAndSend(); + + await new Promise(async (resolve) => { + try { + //instead of this, we need to click "select file", and choose a file + await app.client + .$$("#responses input")[1] + .click() + .keys("testing websocket protocol"); + + await app.client.$("button=Send Message").click(); + + await new Promise((resolve) => + setTimeout(async () => { + try { + const messageClient = await app.client + .$("#ws-msg-0") + .getText(); + const messageServer = await app.client + .$("#ws-msg-1") + .getText(); + expect(messageClient).to.include( + "testing websocket protocol" + ); + expect(messageServer).to.include( + "testing websocket protocol" + ); + resolve(); + } catch (err) { + console.error(err); + } + }, 300) + ); + resolve(); + } catch (err) { + console.error(err); + } + }); } catch (err) { console.error(err); } }); + + // it("it should be able to close and re-open connection", async () => { + // try { + // await composerObj.closeConnectonBtn.click(); + // await composerObj.reopenConnectionBtn.click(); + // } catch (err) { + // console.error(err); + // } + // }); }); };