Feature: support socket.io - [INS-5024] by CurryYangxx · Pull Request #8405 · Kong/insomnia

CurryYangxx · 2025-02-25T02:43:57Z

socket.io-request-1080.mov

Support Socket.io

Feature list:

socket.io request creation
socket.io request payload (multiple args support)
event listeners
Response event log preview

Changes:

add new package: socket.io-client as socket.io client
new db model: socket-io-request socket-io-response socket-io-payload
new UI components under packages/insomnia/src/ui/components/socket-io directory
new IPC bridge for socket.io

const socketIO: SocketIOBridgeAPI = {
  open: options => ipcRenderer.invoke('socketIO.open', options),
  readyState: {
    getCurrent: options => ipcRenderer.invoke('socketIO.readyState', options),
  },
  close: options => ipcRenderer.send('socketIO.close', options),
  closeAll: () => ipcRenderer.send('socketIO.closeAll'),
  event: {
    findMany: options => ipcRenderer.invoke('socketIO.event.findMany', options),
    send: options => ipcRenderer.invoke('socketIO.event.send', options),
    on: options => ipcRenderer.send('socketIO.event.on', options),
    off: options => ipcRenderer.send('socketIO.event.off', options),
  },
};

Reuse Websocket components: feat: reuse websocket component #8828

Copilot

Pull Request Overview

This PR introduces support for Socket.IO requests in the Insomnia app. The changes span multiple layers including models, UI components, IPC handlers, and network operations, ensuring Socket.IO requests, responses, and payloads are handled consistently across the app.

Reviewed Changes

Copilot reviewed 45 out of 46 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
packages/insomnia/src/ui/components/modals/export-requests-modal.tsx	Extended request node types and conditionals to include SocketIORequest.
packages/insomnia/src/ui/components/dropdowns/response-history-dropdown.tsx	Updated response dropdown logic and IPC calls to support SocketIOResponse.
packages/insomnia/src/ui/components/dropdowns/request-actions-dropdown.tsx	Added SocketIORequest to the union type for request actions.
packages/insomnia/src/templating/types.ts	Incorporated SocketIORequest into templating context types.
packages/insomnia/src/sync/git/ne-db-client.ts	Updated type filters and sync logic for SocketIOPayload and SocketIORequest.
packages/insomnia/src/preload.ts	Added and configured the SocketIO bridge API.
packages/insomnia/src/plugins/index.ts	Extended plugin types to include SocketIORequest support.
packages/insomnia/src/network/network.ts	Updated network authentication handling to include SocketIORequest.
packages/insomnia/src/models/socket-io-response.ts	New model with CRUD methods for SocketIOResponse.
packages/insomnia/src/models/socket-io-request.ts	New model defining SocketIORequest and its helper methods.
packages/insomnia/src/models/socket-io-payload.ts	New model for SocketIOPayload with creation, duplicate, and update operations.
packages/insomnia/src/models/request-version.ts	Updated versioning logic to support SocketIORequest.
packages/insomnia/src/models/index.ts	Exported new Socket.IO related models.
packages/insomnia/src/models/helpers/request-operations.ts	Updated helper operations to support SocketIORequest.
packages/insomnia/src/main/network/websocket.ts	Added a debug log line for WebSocket connection open events.
packages/insomnia/src/main/ipc/main.ts, electron.ts, main.development.ts	Extended IPC handlers and channels to include SocketIO methods.
packages/insomnia/src/common/render.ts	Updated render functions to include SocketIORequest in context ancestors.

Files not reviewed (1)

packages/insomnia/package.json: Language not supported

Copilot · 2025-04-29T03:03:57Z

+  }
+
+  return database.duplicate<SocketIOPayload>(request, {
+    name,


The duplicate function references an undefined variable 'name'. Consider using patch.name or setting a default name before passing it to the duplicate function.

Suggested change

}

return database.duplicate<SocketIOPayload>(request, {

name,

} else if (!patch.name) {

patch.name = '';

}

return database.duplicate<SocketIOPayload>(request, {

jackkav · 2025-06-06T13:00:33Z

What have you scoped out?
What else should be done?
What else could be done?
Is this a first pass or a complete feature with no futher ux changes required?
It there any refactoring you considered doing but didn't?
Do you have any other ideas you would like to explore try if you took a second pass?

yaoweiprc · 2025-06-16T11:30:02Z

+  ipcMainHandle('socketIO.event.findMany', (_, options: Parameters<typeof findMany>[0]) => findMany(options));
+};
+
+electron.app.on('window-all-closed', closeAllSocketIOConnections);


Can eventLogFileStreams and timelineFileStreams end correctly here?

I think yes. These will be closed in 'disconnect' event callback.

yaoweiprc · 2025-06-16T11:37:38Z

+
+  socket.off(options.eventName);
+};
+


Suggested change

// Get the event log for a specific response in history

yaoweiprc · 2025-06-16T11:45:14Z

+        direction: 'INCOMING',
+        type: 'message',
+        timestamp: Date.now(),
+        eventName,


Why is the eventName for ack is the same as event name of the message sent, is it by socket-io spec?

The same event name is used here to mark which event the ack is from

yaoweiprc · 2025-06-16T12:16:00Z

+  settingEncodeUrl: boolean;
+  settingStoreCookies: boolean;
+  settingSendCookies: boolean;


Do not find these settings on UI

Will check if we could delete them

yaoweiprc · 2025-06-16T12:23:11Z

+  initialPayload?: string;
+}
+
+const getCertificates = async ({


Maybe we can reuse it for both socket-io and websocket requests.

Agree, we can do some extraction in a separate pr.

yaoweiprc · 2025-06-16T12:36:45Z

+      eventLogFileStreams.get(options.requestId)?.write(JSON.stringify(openEvent) + '\n');
+
+      if (!openedEvents.length) {
+        const infoEvent: SocketIOInfoEvent = {


Will this info event be shown in UI?

Yes, you can see this event message when you connect to a socket.io server

CurryYangxx · 2025-06-24T10:14:04Z

What have you scoped out? What else should be done? What else could be done? Is this a first pass or a complete feature with no futher ux changes required? It there any refactoring you considered doing but didn't? Do you have any other ideas you would like to explore try if you took a second pass?

@jackkav This pr implements basic support for the socket protocol, and I think this is ready for a beta version. There are some UX optimizations that can be done later, such as adding a loading state for the connection button, and others can be continuously optimized based on user feedback. Other things I can think of are:

Abstract some functions and components similar to WebSocket for reuse
Encapsulate some basic components, such as buttons/switches/forms, etc., to improve the efficiency of other features and the consistency of UI
ts type optimization (adding a new request requires modifying many type definitions now)

jackkav · 2025-06-26T11:10:47Z

@CurryYangxx Good work so far.

Can you explain the difference between open close and on off somewhere in the PR. The usage is quite ambiguous, is it possible to eliminate either of them or do they have special differences?

Secondly I would encourage you to reuse the websocket components rather than duplciating them all. Thankfully there is an earlier PR which adds the realtime protocol SSE. #6147

Its much cheaper to do right away in this scope than leave it until later. If its not viable to do in this scope please list where the ui deviates enough to justify 1500 lines of what appears to be largely duplication.

Thanks.

CurryYangxx · 2025-06-30T09:25:06Z

Can you explain the difference between open close and on off somewhere in the PR. The usage is quite ambiguous, is it possible to eliminate either of them or do they have special differences?

@jackkav Socket.io is event-based communication, when the connection is established, the client side can subscribe or unsubscribe to an event to control which event messages will be received from the server side. The open&close is used for connection, and the on & off is for event subscription. You can get more details from here: https://socket.io/docs/v4/listening-to-events/

Secondly I would encourage you to reuse the websocket components rather than duplciating them all. Thankfully there is an earlier PR which adds the realtime protocol SSE. #6147

I agree, I will try to reuse websocket components as much as possible, and I think this may need some UI abstraction.

* init socket.io model * socket.io request panel UI * init socket.io response pane(use RealtimeResponsePane) * adaptive for new socketio tab type * payload panel ui * socketIO event tab UI * fix event switch style * feat: socketIO payload persist * feat: event panel * feat: socketIO IPC * update ui * feat: add query * build response * fix: add db type * add useFetcherWithPromise hook * fix todo * prettier format * attach cert to request * fix minor bugs * fix lint * fix unit test * feat: add proxy for socket.io * Adapt to multiple tabs * disable proxy * fix enable proxy * support git&cloud sync * fix: ci * del console * chore: adapt to react-router v7 * fix bugs * fix: lint * feat: reuse websocket component (Kong#8828) * del unuse field * fix: conflict * fix: lint * fix: type check

CurryYangxx changed the title ~~init socket.io model~~ Feature: support socket.io Feb 25, 2025

CurryYangxx force-pushed the feat/socket.io branch from 4918986 to d214087 Compare February 25, 2025 02:44

CurryYangxx marked this pull request as draft February 25, 2025 03:30

CurryYangxx changed the title ~~Feature: support socket.io~~ Feature: support socket.io - [INS-5024] Feb 25, 2025

CurryYangxx force-pushed the feat/socket.io branch from d214087 to 2572464 Compare February 26, 2025 00:58

CurryYangxx force-pushed the feat/socket.io branch from 9007359 to c93cc0a Compare March 5, 2025 09:45

CurryYangxx force-pushed the feat/socket.io branch from 757fe38 to e1430c1 Compare March 17, 2025 03:01

CurryYangxx force-pushed the feat/socket.io branch 2 times, most recently from 40795f0 to 24dc2cb Compare April 8, 2025 08:22

CurryYangxx force-pushed the feat/socket.io branch 2 times, most recently from 5c10711 to f085109 Compare April 29, 2025 02:51

CurryYangxx marked this pull request as ready for review April 29, 2025 03:03

CurryYangxx requested review from a team and Copilot April 29, 2025 03:03

Copilot AI reviewed Apr 29, 2025

View reviewed changes

CurryYangxx force-pushed the feat/socket.io branch from 704ec31 to a1744bd Compare May 8, 2025 06:51

CurryYangxx force-pushed the feat/socket.io branch from c31c6fd to c1b5829 Compare May 26, 2025 07:49

yaoweiprc reviewed Jun 6, 2025

View reviewed changes

Comment thread packages/insomnia/src/models/socket-io-response.ts

CurryYangxx force-pushed the feat/socket.io branch from 4c7a0a5 to d8dc4c2 Compare June 6, 2025 06:37

yaoweiprc reviewed Jun 16, 2025

View reviewed changes

CurryYangxx force-pushed the feat/socket.io branch from d8dc4c2 to e1e5887 Compare June 24, 2025 10:14

CurryYangxx and others added 25 commits July 22, 2025 11:43

feat: add query

3a89a07

build response

17c0adf

fix: add db type

4b4139f

add useFetcherWithPromise hook

23f39bb

fix todo

217d92a

prettier format

fe7428a

attach cert to request

a938c71

fix minor bugs

033377b

fix lint

0f972af

fix unit test

ea3c8f1

feat: add proxy for socket.io

eb3b493

Adapt to multiple tabs

9bee259

disable proxy

15428de

fix enable proxy

8e3256c

support git&cloud sync

6f1ee53

fix: ci

727719c

del console

aaf2ce1

chore: adapt to react-router v7

286821b

fix bugs

cab4f5f

fix: lint

e18d01d

feat: reuse websocket component (#8828)

2641c9c

del unuse field

e5b036d

fix: conflict

d20e72a

fix: lint

59cc339

fix: type check

70607c6

CurryYangxx force-pushed the feat/socket.io branch from 4738249 to 70607c6 Compare July 22, 2025 03:43

CurryYangxx disabled auto-merge July 22, 2025 04:01

CurryYangxx merged commit 6ae901b into develop Jul 22, 2025
10 checks passed

CurryYangxx deleted the feat/socket.io branch July 22, 2025 04:02

Conversation

CurryYangxx commented Feb 25, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Support Socket.io

Feature list:

Changes:

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI Apr 29, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

jackkav commented Jun 6, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

CurryYangxx commented Jun 24, 2025

Uh oh!

jackkav commented Jun 26, 2025

Uh oh!

CurryYangxx commented Jun 30, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

CurryYangxx commented Feb 25, 2025 •

edited

Loading