click() on Safari does not seem to work on elements inside a fixed box

Using

Intern 4.2.2
Chrome 67
Safari 11.1.1
macOS High Sierra v10.13.5

Current behavior

In fullscreen mode in Safari, when I use the click() method on an element that is inside a fixed block, nothing happens. It works on Chrome.

How to reproduce

I've tried to reproduce a simple example where two buttons can be clicked to create small colored blocks.

The blue button is placed inside the main wrapper element, and create blue box on click.
The green button is placed inside a fixed bar element, and create green box on click.

While we can see both blue and green boxes on Chrome, only the blue one appears on Safari.

I think it could be a mouse position related issue.

index.html

<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="UTF-8">
    <title>Coucou</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  </head>
  <body style="width: 100%; height: 100%; margin: 0;">
    <div id="app" style="width: 100%; height: 100%; padding-top: 50px; background: white;">
      <div id="bar" style="position: fixed; bottom: 0; width: 100%; height: 100px; background: red;">
        <button id="button-green-box" style="background: green; color: white;">Add a cool green box</button>
      </div>
      <button id="button-fullscreen">Go fullscreen</button>
      <button id="button-blue-box" style="background: blue; color: white;">Add a cool blue box</button>
      <div id="box-wrapper"></div>
    </div>
    <script>
      document.querySelector('#button-fullscreen').addEventListener('click', function(e) {
        var body = document.querySelector('body')
        if (body.requestFullscreen) {
          body.requestFullscreen()
        } else {
          body.webkitRequestFullScreen()
        }
      })

      document.querySelector('#button-blue-box').addEventListener('click', function(e) {
        document.querySelector('#box-wrapper').innerHTML += '<div id="blue-box" style="display: inline-block; background: blue; width: 50px; height: 50px;"></div>'
      })

      document.querySelector('#button-green-box').addEventListener('click', function(e) {
        document.querySelector('#box-wrapper').innerHTML += '<div id="green-box" style="display: inline-block; background: green; width: 50px; height: 50px;"></div>'
      })
    </script>
  </body>
</html>

intern.json

{
  "functionalSuites": "test.js",
  "environments": [
    {
      "browserName": "chrome",
      "fixSessionCapabilities": "no-detect"
    },
    {
      "browserName": "safari",
      "fixSessionCapabilities": "no-detect"
    }
  ],
  "tunnelOptions": {
    "drivers": [
      { "name": "chrome" }
    ]
  },
  "maxConcurrency": 1
}

test.js

const { registerSuite } = intern.getInterface('object');
const keys = require('@theintern/leadfoot/keys').default;

registerSuite('User', () => {
  let remote

  return {
    before() {
      remote = this.remote.get('index.html').setFindTimeout(2000)
    },
    tests: {
      'can click on all buttons on fullscreen': () => (
        remote
          .findByCssSelector('#button-fullscreen')
            .click()
            .end()
          .sleep(500)
          .findByCssSelector('#button-blue-box')
            .click()
            .end()
          .sleep(500)
          .findByCssSelector('#blue-box')
            .end()
          .sleep(500)
          .findByCssSelector('#button-green-box')
            .click()
            .end()
          .sleep(500)
          .findByCssSelector('#green-box')
            .end()
          .sleep(500)
      )
    }
  }
})

Results

‣ Created remote session chrome 67.0.3396.99 on Mac OS X (bc087465f12c63710bca03e5c54691ae)
✓ chrome 67.0.3396.99 on Mac OS X - User - can click on all buttons on fullscreen (3.15s)
No unit test coverage for chrome 67.0.3396.99 on Mac OS X
chrome 67.0.3396.99 on Mac OS X: 1 passed, 0 failed

‣ Created remote session safari 13605.2.8 on macOS (B85CF7BE-4764-411F-9579-6ED626B55D6D)
× safari 13605.2.8 on macOS - User - can click on all buttons on fullscreen (4.432s)
    NoSuchElement: [POST http://localhost:4444/wd/hub/session/B85CF7BE-4764-411F-9579-6ED626B55D6D/element / {"using":"css selector","value":"#green-box"}] An element could not be located on the page using the given search parameters.

theintern / leadfoot

click() on Safari does not seem to work on elements inside a fixed box #157

Using

Current behavior

How to reproduce

Results