TRA-3958 show schema (#12)

* Display endpoint schema * Update main.css * fix test python files
up9inc · Dec 2, 2021 · 32c7f72 · 32c7f72
1 parent aa4bd1a
commit 32c7f72
Show file tree

Hide file tree

Showing 10 changed files with 163 additions and 40 deletions.
diff --git a/src/models/internal.ts b/src/models/internal.ts
@@ -14,7 +14,8 @@ export enum MessageCommandType {
 export enum ApiMessageType {
     WorkspacesList = "workspaceList",
     EndpointsList = "endpointList",
-    EndpointTests = "endpointTests"
+    EndpointTests = "endpointTests",
+    Swagger = "swagger"
 }
 
 export interface WebViewApiMessage {

diff --git a/src/providers/up9Api.ts b/src/providers/up9Api.ts
@@ -35,4 +35,10 @@ export class UP9ApiProvider {
         raiseForBadResponse(response);
         return response.data;
     }
+
+    public getSwagger = async(workspaceId: string, token: string): Promise<any> => {
+        const response = await axios.get<any>(`${this._trccUrl}/models/${workspaceId}/lastResults/all/swagger`, {headers: {'Authorization': `Bearer ${token}`}});
+        raiseForBadResponse(response);
+        return response.data;
+    }
 }
diff --git a/src/providers/webviewCommunicator.ts b/src/providers/webviewCommunicator.ts
@@ -67,16 +67,20 @@ export class UP9WebviewCommunicator {
     }
 
     private notifyPanelOfAuthStateChange(authStatus: boolean): void {
-        if (authStatus) {
-            this._panel.webview.postMessage({
-                command: MessageCommandType.AuthSuccess,
-                username: this._authProvider.getUsernameFromToken()
-            });
-        } else {
-            this._panel.webview.postMessage({
-                command: MessageCommandType.AuthSignOut,
-            });
-        }
+        try {
+            if (authStatus) {
+                this._panel.webview.postMessage({
+                    command: MessageCommandType.AuthSuccess,    
+                    username: this._authProvider.getUsernameFromToken()
+                });
+            } else {
+                this._panel.webview.postMessage({
+                    command: MessageCommandType.AuthSignOut,
+                });
+            }
+        } catch (error) {
+            console.warn('failed to send auth state to panel', error);
+        }   
     }
 
     private async sendStoredDataToPanel(): Promise<void> {
@@ -107,6 +111,10 @@ export class UP9WebviewCommunicator {
                     const tests = await this._apiProvider.getTestsForSpan(messageData.params.workspaceId, messageData.params.spanGuid, token);
                     this.handlePanelUP9ApiResponse(messageData, tests, null);
                     break;
+                case ApiMessageType.Swagger:
+                    const swagger = await this._apiProvider.getSwagger(messageData.params.workspaceId, token);
+                    this.handlePanelUP9ApiResponse(messageData, swagger, null);
+                    break;
             }
         } catch (error) {
             console.error("error handling api request from panel", messageData, error);

diff --git a/src/tests/integration/resources/invalidTests.py b/src/tests/integration/resources/invalidTests.py
@@ -1,8 +1,13 @@
-deaf test_1(self):
-    a = 5
-    b = 5
-    assert a == b
-
-def test_2(self):
-    s = "hello"
-    assert len(s) > 3
+import unittest
+
+
+class Tests(unittest.TestCase):
+
+    deaf test_1(self):
+        a = 5
+        b = 5
+        assert a == b
+
+    def test_2(self):
+        s = "hello"
+        assert len(s) > 3
diff --git a/src/tests/integration/resources/testWithError.py b/src/tests/integration/resources/testWithError.py
@@ -1,8 +1,13 @@
-def test_1(self):
-    a = 5
-    b = 7
-    assert a == b
-
-def test_2(self):
-    s = "hello"
-    assert len(s) > 3
+import unittest
+
+
+class Tests(unittest.TestCase):
+
+    def test_1(self):
+        a = 5
+        b = 7
+        assert a == b
+
+    def test_2(self):
+        s = "hello"
+        assert len(s) > 3
diff --git a/src/tests/integration/resources/validTests.py b/src/tests/integration/resources/validTests.py
@@ -1,8 +1,12 @@
-def test_1(self):
-    a = 5
-    b = 5
-    assert a == b
+import unittest
 
-def test_2(self):
-    s = "hello"
-    assert len(s) > 3
+
+class Tests(unittest.TestCase):
+    def test_1(self):
+        a = 5
+        b = 5
+        assert a == b
+
+    def test_2(self):
+        s = "hello"
+        assert len(s) > 3
diff --git a/src/webview/src/components/testsBrowserComponent.tsx b/src/webview/src/components/testsBrowserComponent.tsx
@@ -3,14 +3,15 @@ import {observer} from "mobx-react";
 import { up9AuthStore } from "../stores/up9AuthStore";
 import {sendApiMessage, sendInfoToast, setExtensionDefaultWorkspace} from "../providers/extensionConnectionProvider";
 import { ApiMessageType } from "../../../models/internal";
-import {Form, FormControl, Dropdown, Container, Row, Col, Card} from 'react-bootstrap';
-import { isHexColorDark, transformTest } from "../utils";
+import {Form, FormControl, Dropdown, Container, Row, Col, Card, Accordion} from 'react-bootstrap';
+import { getSchemaForViewForEndpointSchema, isHexColorDark, transformTest } from "../utils";
 import { v4 as uuidv4 } from 'uuid';
 import { copyIcon, userIcon } from "./svgs";
 import { microTestsHeader } from "../../../consts";
 
 import AceEditor from "react-ace";
 import "ace-builds/src-noconflict/mode-python";
+import "ace-builds/src-noconflict/mode-json";
 import "ace-builds/src-noconflict/theme-chaos";
 import "ace-builds/src-noconflict/theme-chrome";
 import { LoadingOverlay } from "./loadingOverlay";
@@ -26,6 +27,7 @@ const TestsBrowserComponent: React.FC<{}> = observer(() => {
     const [workspaces, setWorkspaces] = useState(null);
     const [workspaceFilterInput, setWorkspaceFilterInput] = useState("");
     const [selectedWorkspace, setSelectedWorkspace] = useState("");
+    const [workspaceOAS, setWorkspaceOAS] = useState(null);
 
     const [endpoints, setEndpoints] = useState(null);
     const [endpointFilterInput, setEndpointFilterInput] = useState("");
@@ -60,6 +62,20 @@ const TestsBrowserComponent: React.FC<{}> = observer(() => {
         return workspaces.filter(workspace => workspace.toLocaleLowerCase().indexOf(workspaceFilterInput.toLowerCase()) > -1);
     }, [workspaces, workspaceFilterInput]);
 
+    const endpointSchemaJSONString = useMemo(() => {
+        if (!selectedEndpoint || !workspaceOAS) {
+            return null;
+        }
+
+        const endpointSchema = workspaceOAS?.[selectedEndpoint.service]?.paths?.[selectedEndpoint.path]?.[selectedEndpoint.method.toLowerCase()];
+        if (!endpointSchema) {
+            console.warn("could not find schema for endpoint from OAS");
+            return null;
+        }
+        console.log('endpointSchema', endpointSchema);
+        return getSchemaForViewForEndpointSchema(endpointSchema);
+    }, [selectedEndpoint]);
+
     useEffect(() => {
         setIsThemeDark(isHexColorDark(editorBackgroundColor))
     }, [editorBackgroundColor]);
@@ -100,12 +116,21 @@ const TestsBrowserComponent: React.FC<{}> = observer(() => {
             setSelectedEndpoint(null);
             setEndpointFilterInput("");
             setEndpoints(null);
+            setWorkspaceOAS(null);
+
             if (selectedWorkspace) {
                 try {
                     const endpoints = await sendApiMessage(ApiMessageType.EndpointsList, {workspaceId: selectedWorkspace});
                     setEndpoints(endpoints);
                 } catch (error) {
-                    console.log('error loading endpoints', error);
+                    console.error('error loading workspace endpoints', error);
+                }
+
+                try {
+                    const workspaceOAS = await sendApiMessage(ApiMessageType.Swagger, {workspaceId: selectedWorkspace});
+                    setWorkspaceOAS(workspaceOAS);
+                } catch (error) {
+                    console.error('error loading workspace OAS', error);
                 }
             }
         })()
@@ -224,6 +249,16 @@ const TestsBrowserComponent: React.FC<{}> = observer(() => {
                                 setOptions={{showGutter: false, hScrollBarAlwaysVisible: false, highlightActiveLine: false}}/>
                     </Card.Body>
                 </Card>
+                {endpointSchemaJSONString && <Accordion>
+                    <Accordion.Item eventKey="0">
+                        <Accordion.Header>Endpoint Schema</Accordion.Header>
+                        <Accordion.Body style={{maxHeight: "700px", overflowY: "auto"}}>
+                            <AceEditor width="100%" mode="json" fontSize="14px" maxLines={1000} height={`${14 * endpointSchemaJSONString.split(/\r\n|\r|\n/).length}px`}
+                                theme={isThemeDark ? "chaos" : "chrome"} readOnly={true} value={endpointSchemaJSONString}
+                                setOptions={{showGutter: false, hScrollBarAlwaysVisible: false, highlightActiveLine: false}}/>
+                        </Accordion.Body>
+                    </Accordion.Item>
+                </Accordion>}
             </Container>
             </div>
             </>}

diff --git a/src/webview/src/main.css b/src/webview/src/main.css
@@ -53,6 +53,24 @@ hr {
 	color: var(--vscode-input-foreground);
 }
 
+.accordion, .accordion-item, .accordion-header, .accordion-button {
+	background: var(--vscode-editor-background) !important;
+	color: var(--vscode-editor-foreground) !important;
+}
+
+.accordion-header {
+	border:1px solid var(--vscode-window-inactiveBorder);
+}
+
+.accordion-header:active, .accordion-header:hover, .accordion-header:focus {
+	border:1px solid var(--vscode-window-activeBorder);
+}
+
+.accordion-button::after {
+	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
+	opacity: 0.75;
+}
+
 .select-dropdown {
 	width: 100%;
 }