How to animate a mouse cursor in a webdriverio webpage test

From this answer, I've added the following to a working webdriverio test:

it('Should lock an element on the canvas', async () => {
    browser.execute(() => {
        var mouse = document.createElement('img');
        mouse.setAttribute(
            'src',
            'data:image/png;base64,' +
            'iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAQAAACGG/bgAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAA' +
            'HsYAAB7GAZEt8iwAAAAHdElNRQfgAwgMIwdxU/i7AAABZklEQVQ4y43TsU4UURSH8W+XmYwkS2I0' +
            '9CRKpKGhsvIJjG9giQmliHFZlkUIGnEF7KTiCagpsYHWhoTQaiUUxLixYZb5KAAZZhbunu7O/PKf' +
            'e+fcA+/pqwb4DuximEqXhT4iI8dMpBWEsWsuGYdpZFttiLSSgTvhZ1W/SvfO1CvYdV1kPghV68a3' +
            '0zzUWZH5pBqEui7dnqlFmLoq0gxC1XfGZdoLal2kea8ahLoqKXNAJQBT2yJzwUTVt0bS6ANqy1ga' +
            'VCEq/oVTtjji4hQVhhnlYBH4WIJV9vlkXLm+10R8oJb79Jl1j9UdazJRGpkrmNkSF9SOz2T71s7M' +
            'SIfD2lmmfjGSRz3hK8l4w1P+bah/HJLN0sys2JSMZQB+jKo6KSc8vLlLn5ikzF4268Wg2+pPOWW6' +
            'ONcpr3PrXy9VfS473M/D7H+TLmrqsXtOGctvxvMv2oVNP+Av0uHbzbxyJaywyUjx8TlnPY2YxqkD' +
            'dAAAAABJRU5ErkJggg=='
        );
        mouse.setAttribute('id', 'webdriver-mouse');
        mouse.setAttribute(
            'style',
            'position: absolute; z-index: 999999; pointer-events: none; left:0; top:0'
        );
        body.appendChild(mouse);
        body.onmousemove = function(e) {
            body.getElementById('webdriver-mouse').style.left = e.pageX + 'px';
            body.getElementById('webdriver-mouse').style.top = e.pageY + 'px';
        }
    })

The test passes without an error, but no mouse is being animated.

If I search the console > elements for webdriver-mouse after the test begins, nothing is found.

The test spec file contains:

describe('Locking an Element', () => {
    beforeEach(async () => {  
        await browser.setWindowSize(1920, 1080);
        await browser.pause(3000);
        await browser.url('/login');
        await(await Studio.usernameField).click();
        await browser.keys('doig+wdio@example.com')
        await(await Studio.passwordInput).click();
        await browser.keys('password');
        await(await Studio.loginSubmit).click();
        await browser.pause(6000);
    });
    afterEach(() => {
        browser.execute('window.localStorage.clear()');     
        browser.deleteAllCookies();
        browser.execute('sessionStorage.clear()');
        browser.refresh();
        browser.pause(3000);
    });
    it('Should lock an element on the canvas', async () => {
        browser.execute(() => {
            var mouse = document.createElement('img');
            mouse.setAttribute(
                'src',
                'data:image/png;base64,' +
            'iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAQAAACGG/bgAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAA' +
            'HsYAAB7GAZEt8iwAAAAHdElNRQfgAwgMIwdxU/i7AAABZklEQVQ4y43TsU4UURSH8W+XmYwkS2I0' +
            '9CRKpKGhsvIJjG9giQmliHFZlkUIGnEF7KTiCagpsYHWhoTQaiUUxLixYZb5KAAZZhbunu7O/PKf' +
            'e+fcA+/pqwb4DuximEqXhT4iI8dMpBWEsWsuGYdpZFttiLSSgTvhZ1W/SvfO1CvYdV1kPghV68a3' +
            '0zzUWZH5pBqEui7dnqlFmLoq0gxC1XfGZdoLal2kea8ahLoqKXNAJQBT2yJzwUTVt0bS6ANqy1ga' +
            'VCEq/oVTtjji4hQVhhnlYBH4WIJV9vlkXLm+10R8oJb79Jl1j9UdazJRGpkrmNkSF9SOz2T71s7M' +
            'SIfD2lmmfjGSRz3hK8l4w1P+bah/HJLN0sys2JSMZQB+jKo6KSc8vLlLn5ikzF4268Wg2+pPOWW6' +
            'ONcpr3PrXy9VfS473M/D7H+TLmrqsXtOGctvxvMv2oVNP+Av0uHbzbxyJaywyUjx8TlnPY2YxqkD' +
            'dAAAAABJRU5ErkJggg=='
            );
            mouse.setAttribute('id', 'webdriver-mouse');
            mouse.setAttribute(
                'style',
                'position: absolute; z-index: 999999; pointer-events: none; left:0; top:0'
            );
            body.appendChild(mouse);
            body.onmousemove = function(e) {
                body.getElementById('webdriver-mouse').style.left = e.pageX + 'px';
                body.getElementById('webdriver-mouse').style.top = e.pageY + 'px';
            }
        })
        await(await $('#mat-dialog-0')).waitForDisplayed({timeout:10000});
        ...

wdio.conf.js:

const { join } = require('path')

exports.config = {

specs: [
    './test/specs/**/lock-element.spec.js',
],
maxInstances: 10,
capabilities: [
    {
        maxInstances: 6,
        browserName: 'chrome',
        'goog:chromeOptions': {
            args: ['--disable-prompt-on-repost','--window-size=1920,1080'],
            prefs: {
                'profile.managed_default_content_settings.popups' : 2,
                'profile.managed_default_content_settings.notifications' : 2,
            }
        },
        acceptInsecureCerts: true
     },
],
logLevel: 'error',
bail: 0,
baseUrl: 'https://staging.mandoemedia.com',
waitforTimeout: 10000,
connectionRetryTimeout: 120000,
connectionRetryCount: 3,
services:  [['image-comparison',
  {
    baselineFolder: join(process.cwd(), './tests/visualRegressionBaseline/'),
    formatImageName: '{tag}-{logName}',
    screenshotPath: join(process.cwd(), './tests/visualRegressionDiff/'),
    autoSaveBaseline: true,
    blockOutStatusBar: true,
    blockOutToolBar: true,
    clearRuntimeFolder: true,
    disableCSSAnimation: true
  }]
],
framework: 'mocha',
reporters: ['spec'/*['Allure',{
    outputDir:'allure-results',
    disableWebdriverStepsReporting: true,
    disableWebdriverScreenshotsReporting: false,
}]*/],
mochaOpts: {
    ui: 'bdd',
    timeout: 6000000000
},

from How to animate a mouse cursor in a webdriverio webpage test