Skip to content

Commit cbe9df3

Browse files
authored
Merge pull request #17 from oslabs-beta/dev
Merge latest `dev` branch into `master`
2 parents 4473482 + bbea9cd commit cbe9df3

37 files changed

+432
-594
lines changed

README.md

Lines changed: 34 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
[![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg?style=flat)](https://github.com/getswell/getswell/issues)
99
[![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=Swell-%20For%20all%20your%20streaming%20API%20testing%20needs&url=https://www.getswell.io&hashtags=SSE,WebSocket,HTTP,API,developers)
1010

11-
Swell is an API development tool that enables developers to test endpoints served over streaming technologies including Server-Sent Events (SSE), WebSockets, HTTP2, GraphQL, gRPC, WebRTC, and OpenAPI.
11+
Swell is an API development tool that enables developers to test HTTP2, GraphQL endpoints, as well as ones served over streaming technologies including Server-Sent Events (SSE), WebSockets, gRPC, WebRTC, and OpenAPI.
1212

1313
## Getting Started
1414

@@ -22,31 +22,27 @@ Swell is a one-stop shop for sending and monitoring your API requests:
2222

2323
- Send and monitor streams over HTTP2 / HTTP1 (including SSEs) and WebSockets
2424
- Create GraphQL queries, introspections, mutations, and subscriptions
25+
- Stress testing HTTP/2 endpoints
26+
- Store workspaces of multiple requests for later use
27+
- Import and export workspaces locally
2528
- Make API requests based on a range of provided options that conform to the specifications defined in OpenAPI documents.
2629
- Verify STUN and TURN server connectivity for WebRTC applications by generating an SDP (Session Description Protocol)
2730
- Diagnose and monitor your gRPC streaming connections
2831
- Make customizable requests to TypeScript Remote Procedure Call (tRPC) endpoints
2932
- View response timing information and history in an interactive chart for each request
30-
- Store workspaces of multiple requests for later use
31-
- Import, export, and share workspaces with other developers
3233
- Compose test suites in JavaScript with Chai-style TDD/BDD assertion syntax
33-
- Execute a collection of requests in succession and receive clear visual feedback of each test's status
34-
- Schedule requests to be sent on a regular time interval to support endpoint functional validation tests
3534

3635
## Supported Technologies
3736

3837
- _HTTP2_: Swell supports full HTTP2 multiplexing of requests and responses. HTTP requests to the same host will be sent over the same connection. Swell will attempt to initiate an HTTP2 connection for all HTTPS requests by default, with the ability to revert to HTTP1.1 for legacy servers. Multiple concurrent streams are allowed for each connection.
3938
<img src="./ReadMeGifs/Gifs/HttpTesting.gif" style="display: block; margin: 10px auto 30px; border: 1px solid black;" />
39+
40+
- _GraphQL_: Swell includes full support for all three root types of GraphQL - queries, mutations, and subscriptions – as well as Introspection. Variables are also supported, making creating queries easy.
41+
<img src="./ReadMeGifs/Gifs/GraphQL.gif" style="display: block; margin: 10px auto 30px;" />
4042

4143
- _Server-Sent Events (SSE)_: Initiated by a simple toggle box, Swell displays SSE events one by one as they come in. Similar to HTTP2 streams, multiple open connection streams are allowed for SSE.
4244
<img src="./ReadMeGifs/Gifs/SSE.gif" style="display: block; margin: 10px auto 30px;" />
4345

44-
- _WebSockets (WS)_: Swell enables connecting directly to WebSocket servers with an HTTP handshake, with developers able to send messages to the connected WS server directly. All outgoing and incoming messages are displayed in real time.
45-
<img src="./ReadMeGifs/Gifs/Websockets.gif" style="display: block; margin: 10px auto 30px;" />
46-
47-
- _GraphQL_: Swell includes full support for all three root types of GraphQL - queries, mutations, and subscriptions – as well as Introspection. Variables are also supported, making creating queries easy.
48-
<img src="./ReadMeGifs/Gifs/GraphQL.gif" style="display: block; margin: 10px auto 30px;" />
49-
5046
- _gRPC_: Swell includes full support for all four streaming types of gRPC - unary, client stream, server stream, bidirectional stream.
5147
<img src="./ReadMeGifs/Gifs/gRPC-responses.gif" style="display: block; margin: 10px auto 30px;" />
5248

@@ -67,25 +63,6 @@ Swell is a one-stop shop for sending and monitoring your API requests:
6763
- _OpenAPI_: Swell supports the enumeration and execution of REST and RPC API requests as defined in a user-provided OpenAPI document.
6864
<img src="./ReadMeGifs/Gifs/openapi.gif" style="display: block; margin: 10px auto 30px;" />
6965

70-
- _WebRTC_: Swell makes it easy to test STUN and TURN ICE server connectivity for WebRTC applications.
71-
<img src="./ReadMeGifs/Gifs/webrtc.gif" style="display: block; margin: 10px auto 30px; " />
72-
73-
Once you enter ICE server details as an array of JavaScript objects (example code block below). An RTCPeerConnection will be instantiated, as an SDP is generated.
74-
75-
```js
76-
[
77-
{
78-
urls: 'turn:111.222.333.444:54321',
79-
username: 'myAwesomeUsername',
80-
credential: 'mySecretPassword', // or token
81-
credentialType: 'password',
82-
},
83-
{
84-
urls: 'stun:555.777.888.999:43210',
85-
},
86-
];
87-
```
88-
8966
## Additional Features
9067

9168
- _Send Requests Directly to an Endpoint_: You are able to immediately send a request to an endpoint OR stage a request in your workspace for multi-level testing.
@@ -101,9 +78,6 @@ Swell is a one-stop shop for sending and monitoring your API requests:
10178
- _Collection Runner_: You can also stage requests in the workspace and automate the process of sending off each one. No need to manually press send on each one; instead each request will fire off in the order of staging.
10279
<img src="./ReadMeGifs/Gifs/CollectionTest.gif"
10380
style="display: block; margin: 10px auto 30px; border: 1px solid black;" />
104-
- _Schedule Tests_: You can also automate sending requests cyclically.
105-
<img src="./ReadMeGifs/Gifs/ScheduleTest.gif"
106-
style="display: block; margin: 10px auto 30px; border: 1px solid black;" />
10781

10882
## WIP Features
10983

@@ -112,9 +86,29 @@ Swell is a one-stop shop for sending and monitoring your API requests:
11286
- _Webhooks_: Swell includes user-defined HTTP callback connection testing designed to test other server's connection to the web and ability to send data. The test insures that when an event occurs, the source site makes an HTTP request to the URL configured for the webhook.
11387
<img src="./ReadMeGifs/Gifs/Webhook.gif" style="float: left; margin-right: 10px;margin-bottom : 30px; margin-top : 10px;" />
11488

115-
- _UI Updates_: Built with Material UI, a smoother, more intuitive interface for enhanced user experience.
116-
<img src="./ReadMeGifs/Gifs/NewUI.png" style="float: left; margin-right: 10px;margin-bottom : 30px; margin-top : 10px;" />
117-
Added in version 1.12.0: resizable panels between composer, response, and workspace and visual feedbackfor when users is selecting different communication protocols.
89+
- _WebSockets (WS)_: Swell enables connecting directly to WebSocket servers with an HTTP handshake, with developers able to send messages to the connected WS server directly. All outgoing and incoming messages are displayed in real time.
90+
<img src="./ReadMeGifs/Gifs/Websockets.gif" style="display: block; margin: 10px auto 30px;" />
91+
92+
- _WebRTC_: Swell makes it easy to test STUN and TURN ICE server connectivity for WebRTC applications.
93+
<img src="./ReadMeGifs/Gifs/webrtc.gif" style="display: block; margin: 10px auto 30px; " />
94+
95+
Currently, it is a read-only feature. When the write feature for ICE server is enable, ICE server details can be entered as an array of JavaScript objects (example code block below). An RTCPeerConnection will be instantiated, as an SDP is generated.
96+
97+
```js
98+
[
99+
{
100+
urls: 'turn:111.222.333.444:54321',
101+
username: 'myAwesomeUsername',
102+
credential: 'mySecretPassword', // or token
103+
credentialType: 'password',
104+
},
105+
{
106+
urls: 'stun:555.777.888.999:43210',
107+
},
108+
];
109+
```
110+
111+
- _UI Updates_: Built with Material UI, a smoother, more intuitive interface for enhanced user experience. Resizable panels between composer, response, and workspace and visual feedbackfor when users is selecting different communication protocols.
118112
<img src="./ReadMeGifs/Gifs/tRPC-UI.gif" style="float: left; margin-right: 10px;margin-bottom : 30px; margin-top : 10px;" />
119113

120114
## Built With
@@ -138,6 +132,10 @@ Swell is a one-stop shop for sending and monitoring your API requests:
138132

139133
## Authors
140134

135+
- **Chris Suzukida** - [csuzukida](https://github.com/csuzukida)
136+
- **Fred Kim** - [Fredkim21](https://https://github.com/Fredkim21)
137+
- **Jason Huang** - [jjhuang3](https://https://github.com/jjhuang3)
138+
- **Nattie Chan** - [nattiechan](https://https://github.com/nattiechan)
141139
- **Jack Sonoda** - [jackksono](https://github.com/jackksono)
142140
- **Jaden Nguyen** - [jaden-nguyen](https://github.com/jaden-nguyen)
143141
- **Taner Malmedal** - [tannermalmedal](https://github.com/tannermalmedal)

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "swell",
3-
"version": "1.12.0",
3+
"version": "1.13.0",
44
"description": "Swell",
55
"main": "main.js",
66
"repository": "https://github.com/open-source-labs/Swell",
@@ -501,3 +501,4 @@
501501
}
502502
]
503503
}
504+

src/assets/style/App.scss

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
@import 'colors';
22
@import 'darkMode';
3-
43
@import 'infinite';
5-
// @import "@fortawesome/fontawesome-free";
64
@import 'base';
75
@import 'sidebar';
86
@import 'workspace';

src/assets/style/base.scss

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
1-
21
* {
32
box-sizing: border-box;
43
font-size: 13px;
5-
// background-color: lightgray;
6-
// background-color: aquamarine;
74
}
85

96
// BULMA ADJUSTMENTS
@@ -13,7 +10,7 @@
1310
}
1411

1512
.hero h3 {
16-
font-family: "Source Sans Pro", sans-serif;
13+
font-family: 'Source Sans Pro', sans-serif;
1714
font-weight: 600; // font boldness in banner (composer, workspace responses)
1815
}
1916

@@ -39,7 +36,6 @@ input:focus {
3936
align-items: center;
4037
justify-content: space-around;
4138
height: 2.5rem !important;
42-
// z-index: 100;
4339
opacity: 0.8;
4440
margin: 0;
4541
padding: 0;
@@ -109,3 +105,8 @@ $switch-focus: 5px solid red;
109105
.gutter.gutter-vertical:hover {
110106
cursor: row-resize;
111107
}
108+
109+
.no-focus-outline:focus {
110+
outline: none;
111+
}
112+

src/assets/style/colors.scss

Lines changed: 0 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -27,35 +27,6 @@ $primary: $primary-500;
2727
$success: $primary-300;
2828
$danger: $primary-200;
2929
$text: $neutral-400;
30-
// $link: $blue
31-
// $info: $cyan
32-
// $success: $green
33-
// $warning: $yellow
34-
// $dark: $grey-darker
35-
36-
// CODE MIRROR COLORS
37-
.cm-s-neo .cm-comment {
38-
color: $neutral-400 !important;
39-
}
40-
.cm-s-neo .cm-keyword,
41-
.cm-s-neo .cm-property {
42-
color: #a626a4 !important;
43-
}
44-
.cm-s-neo .cm-atom,
45-
.cm-s-neo .cm-number {
46-
color: $primary-200 !important;
47-
}
48-
.cm-s-neo .cm-node,
49-
.cm-s-neo .cm-tag {
50-
color: #a57b25 !important;
51-
}
52-
.cm-s-neo .cm-string {
53-
color: $primary-500 !important;
54-
}
55-
.cm-s-neo .cm-variable,
56-
.cm-s-neo .cm-qualifier {
57-
color: #a59a06 !important;
58-
}
5930

6031
.is-primary-100 {
6132
color: $neutral-500 !important; // this is send and add font color

src/assets/style/responsepane.scss

Lines changed: 0 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -38,35 +38,6 @@
3838
text-align: center;
3939
}
4040

41-
// EVENTS (CODEMIRROR STYLES)
42-
.CodeMirror * {
43-
font-family: 'Lucida Console', Monaco, monospace;
44-
// background-color: grey;
45-
}
46-
47-
.cm-s-neo.CodeMirror {
48-
background-color: transparent !important;
49-
}
50-
51-
.cm-s-responsebody {
52-
// background-color: $neutral-100;
53-
color: $neutral-400;
54-
border: 1px solid $neutral-300;
55-
font-size: 1rem;
56-
margin-bottom: 0 !important;
57-
// height: 800px !important;
58-
height: calc(100vh - 8rem) !important;
59-
// height: 100% !important;
60-
}
61-
.cm-s-responsebody .CodeMirror-gutters {
62-
border: none;
63-
color: $neutral-300;
64-
}
65-
.cm-s-responsebody .CodeMirror-linenumber {
66-
border: none;
67-
color: $neutral-300;
68-
}
69-
7041
// HEADERS & COOKIES
7142

7243
.scrollable-containers {

src/assets/style/sidebar.scss

Lines changed: 4 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -87,53 +87,12 @@
8787
width: 130px;
8888
}
8989

90-
// CODE MIRROR
91-
.cm-s-sidebar {
92-
background-color: $neutral-100;
93-
color: $neutral-400;
94-
border: 1px solid $neutral-300;
95-
font-family: 'Source Sans Pro', sans-serif !important;
96-
font-size: 0.75em;
97-
}
98-
.cm-s-sidebar .CodeMirror-gutters {
99-
border: none;
100-
background-color: $neutral-100;
101-
color: $neutral-300;
102-
}
103-
104-
.cm-s-sidebar .CodeMirror-linenumber {
105-
border: none;
106-
color: $neutral-300;
107-
}
108-
10990
.component {
11091
& :global(.react-codemirror2) {
11192
overflow: auto; /* you can use hidden here as well */
11293
}
11394
}
11495

115-
.cm-s-responsebody .CodeMirror-wrap {
116-
height: 1000px !important;
117-
}
118-
119-
.cm-s-grpc {
120-
background-color: $neutral-100;
121-
color: $neutral-400;
122-
max-height: 100px !important;
123-
border: 1px solid $neutral-300;
124-
font-family: 'Source Sans Pro', sans-serif !important;
125-
font-size: 0.75em;
126-
}
127-
.cm-s-grpc .CodeMirror-gutters {
128-
border: none;
129-
background-color: $neutral-100;
130-
color: $neutral-300;
131-
}
132-
.cm-s-grpc .CodeMirror-linenumber {
133-
border: none;
134-
color: $neutral-300;
135-
}
136-
13796
.switch:focus {
13897
border: none;
13998
outline: none;
@@ -186,16 +145,12 @@
186145
justify-content: space-between;
187146
}
188147

189-
.httpResReq {
148+
.flex-space-around {
190149
display: flex;
191-
justify-content: space-between;
150+
justify-content: space-around;
192151
}
193152

194-
.restReqBtns {
195-
display: flex;
196-
197-
p {
198-
line-height: 3.5rem;
199-
}
153+
.container-margin {
154+
margin: 0 1rem 0 1rem;
200155
}
201156

src/assets/style/workspace.scss

Lines changed: 0 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -196,26 +196,6 @@
196196
border-radius: 2px !important;
197197
}
198198

199-
// CODEMIRROR STYLES
200-
201-
.cm-s-readonly {
202-
background-color: $neutral-100;
203-
color: $neutral-400;
204-
max-height: 150px !important;
205-
border: 1px solid $neutral-300;
206-
font-family: 'Source Sans Pro', sans-serif !important;
207-
font-size: 0.75em;
208-
}
209-
.cm-s-readonly .CodeMirror-gutters {
210-
border: none;
211-
background-color: $neutral-100;
212-
color: $neutral-300;
213-
}
214-
.cm-s-readonly .CodeMirror-linenumber {
215-
border: none;
216-
color: $neutral-300;
217-
}
218-
219199
.no-styling {
220200
padding: 0;
221201
margin: 0;

0 commit comments

Comments
 (0)