Hide Testcafe Overlay

I'm trying to use testcafe to fill forms on a page. When the form is filled, I'd like to be able to stop the test with the window still open so a human can review the form before clicking submit.

I can pause the test with t.debug() but this locks the page and shows the testcafe controls overlay at the bottom.

Is there a way I can remove this overlay and unlock the page?

I've tried using client functions to hide the element with javascript as follows:

test('test_1', async (t) => {
  const hideOverlay = ClientFunction(function() {
    const target = document.querySelector('#root-hammerhead-shadow-ui > div > div');
    target.style.display = 'none';

    return true;
  })

  await t.wait(5000);

  setTimeout(async function() {
    const res = await hideOverlay();
    console.log('-------->', { res });
  }, 6000);

  await t.debug();
});

Since no code will be executed after debug is invoked, I thought I could use a settimeout to queue the call to the function that hides the overlay, so that it is queued and only executes after debug is called and the overlay is visible.

Didn't work though :( code didn't execute, got an unhandled promise rejection. Could really use some help here, thanks :)