index.js

beforeEach( function() {
  window.logCalls = 1;
  window.testFlow = [];
});

Cypress.Commands.overwrite('log', (originalFn, message) => {

  Cypress.log({
    displayName: `--- ${window.logCalls}. ${message} ---`,
    name: `--- ${window.logCalls}. ${message} ---`,
    message: ''
  });

  window.testFlow.push(`${window.logCalls}. ${message}`);
  window.logCalls++;

});

Cypress.on('fail', (error) => {

  throw new Error(error + '\n\nTest flow:\n' + window.testFlow.join('\n')); 

});

take a look at cypress-io/cypress#2134 (comment)

Nice! 👍

It looks like this is working in Typescript as well. But for some reason "logCalls" and "testFlow" are getting highlighted for not existing property for window. Any recommended solution how to avoid highlighting?

I have found it is feasible to use "any" command but it is a bit dirty according to feedback.

I added these to my support/index.js as well:

declare global {
  interface Window {
    logCalls: number;
    testFlow: string[];
  }
}

Perfect! Thank you.