Runner: Replace chrome driver by firefox driver

alexander-nitsche commented 3 years ago

The screenshot runner should replace the chrome by the firefox driver if there are no significant drawbacks. This is to reduce unnecessary dependency on monopolists.

Preconditions to replace chrome by firefox:

Firefox: Screenshot of clicked select box should show options layer: https://github.com/mozilla/geckodriver/issues/1907
Firefox: Scrollbars should be rendered for layers, custom elements and iframes: https://github.com/mozilla/geckodriver/issues/1908

alexander-nitsche commented 3 years ago

Hi windows & mac users,

would you run the following test scenario and post here the screenshot Scrollbars.png. I would like to check if it differs from this one rendered at Linux:

1) Checkout this project with branch task-replace-chrome-by-firefox:

git clone https://github.com/TYPO3-Documentation/t3docs-screenshots.git
cd t3docs-screenshots
git checkout task-replace-chrome-by-firefox

2)

Install TYPO3 in the container - if not done already - by
```
    ddev install
    ddev launch
```
```
– or –
```

Start the existing TYPO3 instance by

    ddev start

and wait for pulling the selenium+firefox docker image

3) Place these files at public/scrollbars.html and public/scrollbarsIframe.html:

<html>
<body style="background-color:grey;">
<h1 style="height:40px;">Scrollbars</h1>
<div style="width:200px;height:260px;background-color:green;overflow:auto;float:left;">
    Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
    Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
</div>
<iframe src="./scrollbarsIframe.html" style="width:200px;height:260px;background-color:blue;float:left;"></iframe>
<div style="width:200px;height:260px;background-color:orange;overflow-y:scroll;float:left;">
    Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
    Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
</div>
</body>
</html>

and

<html>
<body>
Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
</body>
</html>

4) Create a dummy file public/t3docs/My-Manual/screenshots.json by

ddev init-screenshot-json

5) Replace the file content of public/t3docs/My-Manual/screenshots.json with:

{
    "suites": {
        "Core": {
            "screenshots": {
                "scrollbars": [
                    {"action": "resizeWindow", "width": 660, "height": 420},
                    {"action": "amOnUrl", "url": "http://web/scrollbars.html"},
                    {"action": "canSee", "text": "Scrollbars"},
                    {"action": "makeScreenshotOfWindow", "fileName": "Scrollbars"}
                ]
            }
        }
    }
}

6) Fix typo3/testing-framework by replacing the content of file /vendor/typo3/testing-framework/Classes/Core/Acceptance/Helper/Acceptance.php with this file content. 7) Run it by