Change:
assert.ok(inserted.innerHTML.indexOf('>third stream content</') > -1, `Content was not added to output element: ${outputElement.innerHTML}`); }); <ins> test(`Consolidated streaming outputs should replace matching outputs correctly`, async () => { const context = createContext({ outputScrolling: false }); const renderer = await activate(context); assert.ok(renderer, 'Renderer not created'); const outputHtml = new OutputHtml(); const outputElement = outputHtml.getFirstOuputElement(); const outputItem1 = createOutputItem('first stream content', stdoutMimeType, '1'); const outputItem2 = createOutputItem('second stream content', stdoutMimeType, '2'); await renderer!.renderOutputItem(outputItem1, outputElement); const secondOutput = outputHtml.appendOutputElement(); await renderer!.renderOutputItem(outputItem2, secondOutput); const newOutputItem1 = createOutputItem('replaced content', stdoutMimeType, '2'); await renderer!.renderOutputItem(newOutputItem1, secondOutput); const inserted = outputElement.firstChild as HTMLElement; assert.ok(inserted, `nothing appended to output element: ${outputElement.innerHTML}`); assert.ok(inserted.innerHTML.indexOf('>first stream content</') > -1, `Content was not added to output element: ${outputHtml.cellElement.innerHTML}`); assert.ok(inserted.innerHTML.indexOf('>replaced content</') > -1, `Content was not added to output element: ${outputHtml.cellElement.innerHTML}`); assert.ok(inserted.innerHTML.indexOf('>second stream content</') === -1, `Content was not replaced in output element: ${outputHtml.cellElement.innerHTML}`); }); test(`Streaming outputs interleaved with other mime types will produce separate outputs`, async () => { const context = createContext({ outputScrolling: false }); const renderer = await activate(context); assert.ok(renderer, 'Renderer not created'); const outputHtml = new OutputHtml(); const firstOutputElement = outputHtml.getFirstOuputElement(); const outputItem1 = createOutputItem('first stream content', stdoutMimeType, '1'); const outputItem2 = createOutputItem(JSON.stringify(error), errorMimeType, '2'); const outputItem3 = createOutputItem('second stream content', stdoutMimeType, '3'); await renderer!.renderOutputItem(outputItem1, firstOutputElement); const secondOutputElement = outputHtml.appendOutputElement(); await renderer!.renderOutputItem(outputItem2, secondOutputElement); const thirdOutputElement = outputHtml.appendOutputElement(); await renderer!.renderOutputItem(outputItem3, thirdOutputElement); assert.ok(firstOutputElement.innerHTML.indexOf('>first stream content</') > -1, `Content was not added to output element: ${outputHtml.cellElement.innerHTML}`); assert.ok(secondOutputElement.innerHTML.indexOf('>NameError</') > -1, `Content was not added to output element: ${outputHtml.cellElement.innerHTML}`); assert.ok(thirdOutputElement.innerHTML.indexOf('>second stream content</') > -1, `Content was not added to output element: ${outputHtml.cellElement.innerHTML}`); }); </ins> test(`Multiple adjacent streaming outputs, rerendering the first should erase the rest`, async () => { const context = createContext(); const renderer = await activate(context);

Discussion:
Inconsistent repro, not sure what triggers it yet. <img width="301" alt="image" src=""
this is caused by the first one or two lines of output to be in one output item and the rest in another. In the case above: While the second output keeps streaming in, it is supposed to be replaced each time, but we were looking in the wrong element for the previous output to be replaced. I don't know why the outputs are split like this and is the first time I've ever noticed it happening.
Another progress with simple ASCII output (previous sample was HTML) (install using )
Some other samples, that seems to be flaky Code
verification steps: run the example that Don provided in a notebook cell only one progress bar should appear and refresh