fix: make streaming work in JS code example (#3891)

* fix js code

* fix js code

* fix js code

* fix js code

* update js code

* update js code
This commit is contained in:
Yuqi Tang 2024-10-02 16:34:05 -07:00 committed by GitHub
commit 91e5ae797d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 33 additions and 23 deletions

View file

@ -52,33 +52,43 @@ export default function getJsApiCode({
return this.post(endpoint, { input_value: inputValue, input_type: inputType, output_type: outputType, tweaks: tweaks });
}
handleStream(streamUrl, onUpdate, onClose, onError) {
const eventSource = new EventSource(streamUrl);
eventSource.onmessage = event => {
const data = JSON.parse(event.data);
onUpdate(data);
};
eventSource.onerror = event => {
console.error('Stream Error:', event);
onError(event);
eventSource.close();
};
eventSource.addEventListener("close", () => {
async handleStream(streamUrl, onUpdate, onClose, onError) {
try {
const response = await fetch(streamUrl);
const reader = response.body.getReader();
const decoder = new TextDecoder();
while (true) {
const { done, value } = await reader.read();
if (done) {
onClose('Stream closed');
eventSource.close();
});
return eventSource;
break;
}
const chunk = decoder.decode(value);
const lines = chunk.split(\'\\n\').filter(line => line.trim() !== '');
for (const line of lines) {
if (line.startsWith('data: ')) {
try {
const data = JSON.parse(line.slice(6));
onUpdate(data);
} catch (error) {
console.error('Error parsing JSON:', error);
}
}
}
}
} catch (error) {
console.error('Stream Error:', error);
onError(error);
}
}
async runFlow(flowIdOrName, inputValue, inputType = 'chat', outputType = 'chat', tweaks, stream = false, onUpdate, onClose, onError) {
try {
const initResponse = await this.initiateSession(flowIdOrName, inputValue, inputType, outputType, stream, tweaks);
if (stream && initResponse?.outputs?.[0]?.outputs?.[0]?.artifacts?.stream_url) {
const streamUrl = initResponse.outputs[0].outputs[0].artifacts.stream_url;
const streamUrl = this.baseURL + initResponse.outputs[0].outputs[0].artifacts.stream_url;
console.log(\`Streaming from: \${streamUrl}\`);
this.handleStream(streamUrl, onUpdate, onClose, onError);
}
@ -125,7 +135,7 @@ export default function getJsApiCode({
args[0], // inputValue
args[1], // inputType
args[2], // outputType
args[3] === 'true' // stream
args[3] === 'true' // streaming
);
`;
}

View file

@ -57,7 +57,7 @@ test("user should be able to connect RetrieverTool to another components", async
.hover()
.then(async () => {
await page.mouse.down();
await page.mouse.move(-500, 500);
await page.mouse.move(-300, 300);
});
await page.mouse.up();
@ -86,7 +86,7 @@ test("user should be able to connect RetrieverTool to another components", async
await chromaDbOutput.hover();
await page.mouse.down();
const retrieverToolInput = await page
.getByTestId("handle-retrievertool-shownode-retriever-left")
.getByTestId("handle-nvidiarerankcomponent-shownode-retriever-left")
.nth(0);
await retrieverToolInput.hover();
await page.mouse.up();