Issue #2901792 by alexpott, tedbow, dww, bnjmnm, jhodgdon, Krzysztof Domański: Disable all animations in Javascript testing

merge-requests/1119/head
catch 2019-05-22 15:28:27 +01:00
parent 8f8ddab283
commit f4b3ab3a3b
20 changed files with 114 additions and 69 deletions

View File

@ -1,7 +0,0 @@
/**
* Remove all transitions for testing.
*/
* {
/* CSS transitions. */
transition: none !important;
}

View File

@ -1,7 +0,0 @@
# @todo Remove this module & its usages in https://www.drupal.org/node/2901792.
name: 'Layout Builder Test Disable Animations'
type: module
description: 'Disables CSS animations for tests '
package: Testing
version: VERSION
core: 8.x

View File

@ -1,4 +0,0 @@
layout_builder.disable_css_transitions:
css:
component:
css/layout_builder_test_css_transitions.test.css: {}

View File

@ -1,16 +0,0 @@
<?php
/**
* @file
* Attaches CSS to disable animations.
*
* CSS animations cause intermittent errors in some tests.
*/
/**
* Implements hook_page_attachments().
*/
function layout_builder_test_css_transitions_page_attachments(array &$attachments) {
// Unconditionally attach an asset to the page.
$attachments['#attached']['library'][] = 'layout_builder_test_css_transitions/layout_builder.disable_css_transitions';
}

View File

@ -38,6 +38,9 @@ class BlockFormMessagesTest extends WebDriverTestBase {
* Tests that validation messages are shown on the block form.
*/
public function testValidationMessage() {
// @todo Work out why this fixes random fails in this test.
// https://www.drupal.org/project/drupal/issues/3055982
$this->getSession()->resizeWindow(800, 1000);
$assert_session = $this->assertSession();
$page = $this->getSession()->getPage();
@ -67,6 +70,7 @@ class BlockFormMessagesTest extends WebDriverTestBase {
$page->pressButton('Add block');
$block_css_locator = '#layout-builder .block-system-powered-by-block';
$this->assertNotEmpty($assert_session->waitForElementVisible('css', $block_css_locator));
$this->waitForNoElement('#drupal-off-canvas');
$assert_session->assertWaitOnAjaxRequest();
$this->drupalGet($this->getUrl());

View File

@ -23,7 +23,6 @@ class ContextualLinksTest extends WebDriverTestBase {
'layout_builder',
'layout_builder_views_test',
'layout_test',
'layout_builder_test_css_transitions',
'block',
'node',
'contextual',

View File

@ -81,6 +81,9 @@ class InlineBlockPrivateFilesTest extends InlineBlockTestBase {
'create and edit custom blocks',
]));
$this->drupalGet('node/1/layout');
// @todo Occasionally SQLite has database locks here. Waiting seems to
// resolve it. https://www.drupal.org/project/drupal/issues/3055983
$assert_session->assertWaitOnAjaxRequest();
$file = $this->createPrivateFile('drupal.txt');
$file_real_path = $this->fileSystem->realpath($file->getFileUri());

View File

@ -31,7 +31,6 @@ class LayoutBuilderDisableInteractionsTest extends WebDriverTestBase {
'node',
'search',
'contextual',
'layout_builder_test_css_transitions',
];
/**
@ -313,13 +312,8 @@ class LayoutBuilderDisableInteractionsTest extends WebDriverTestBase {
* @todo: Remove after https://www.drupal.org/project/drupal/issues/2892440
*/
public function assertNoElementAfterWait($selector, $timeout = 10000, $message = '') {
$page = $this->getSession()->getPage();
if ($message === '') {
$message = "Element '$selector' was not on the page after wait.";
}
$this->assertTrue($page->waitFor($timeout / 1000, function () use ($page, $selector) {
return empty($page->find('css', $selector));
}), $message);
$condition = "(typeof jQuery !== 'undefined' && jQuery('$selector').length === 0)";
$this->assertJsCondition($condition, $timeout, $message);
}
}

View File

@ -26,7 +26,6 @@ class LayoutBuilderQuickEditTest extends QuickEditJavascriptTestBase {
public static $modules = [
'node',
'layout_builder',
'layout_builder_test_css_transitions',
];
/**

View File

@ -29,7 +29,6 @@ class LayoutBuilderUiTest extends WebDriverTestBase {
'block_content',
'contextual',
'views',
'layout_builder_test_css_transitions',
];
/**

View File

@ -20,7 +20,6 @@ class TestMultiWidthLayoutsTest extends WebDriverTestBase {
public static $modules = [
'layout_builder',
'layout_builder_test_css_transitions',
'block',
'node',
];

View File

@ -1052,6 +1052,10 @@ class MediaLibraryTest extends WebDriverTestBase {
$page->uncheckField("Select $existing_media_name");
$page->fillField('Alternative text', $this->randomString());
$assert_session->hiddenFieldValueEquals('current_selection', '');
// Close the details element so that clicking the Save and select works.
// @todo Fix dialog or test so this is not necessary to prevent random
// fails. https://www.drupal.org/project/drupal/issues/3055648
$this->click('details.media-library-add-form__selected-media summary');
$assert_session->elementExists('css', '.ui-dialog-buttonpane')->pressButton('Save and select');
$assert_session->assertWaitOnAjaxRequest();
$media_items = Media::loadMultiple();
@ -1325,6 +1329,10 @@ class MediaLibraryTest extends WebDriverTestBase {
$assert_session->checkboxChecked("Select $vimeo_title", $selection_area);
$page->uncheckField("Select $vimeo_title");
$assert_session->hiddenFieldValueEquals('current_selection', '');
// Close the details element so that clicking the Save and select works.
// @todo Fix dialog or test so this is not necessary to prevent random
// fails. https://www.drupal.org/project/drupal/issues/3055648
$this->click('details.media-library-add-form__selected-media summary');
$assert_session->elementExists('css', '.ui-dialog-buttonpane')->pressButton('Save and select');
$assert_session->assertWaitOnAjaxRequest();
$media_items = Media::loadMultiple();

View File

@ -2,26 +2,3 @@
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode input {
pointer-events: inherit !important;
}
/**
* Remove all transitions for testing.
*/
* {
/* CSS transitions. */
-o-transition-property: none !important;
-moz-transition-property: none !important;
-ms-transition-property: none !important;
-webkit-transition-property: none !important;
transition-property: none !important;
/* CSS transforms. */
-o-transform: none !important;
-moz-transform: none !important;
-ms-transform: none !important;
-webkit-transform: none !important;
transform: none !important;
/* CSS animations. */
-webkit-animation: none !important;
-moz-animation: none !important;
-o-animation: none !important;
-ms-animation: none !important;
animation: none !important;
}

View File

@ -0,0 +1,36 @@
/**
* Remove CSS animation effects that can cause random test failures.
*/
* {
/* CSS transitions. */
-o-transition: none !important;
-moz-transition: none !important;
-ms-transition: none !important;
-webkit-transition: none !important;
transition: none !important;
-o-transition-property: none !important;
-moz-transition-property: none !important;
-ms-transition-property: none !important;
-webkit-transition-property: none !important;
transition-property: none !important;
/* CSS transforms. */
-o-transform: none !important;
-moz-transform: none !important;
-ms-transform: none !important;
-webkit-transform: none !important;
transform: none !important;
/* CSS animations. */
-webkit-animation: none !important;
-moz-animation: none !important;
-o-animation: none !important;
-ms-animation: none !important;
animation: none !important;
}
/**
* Prevent youtube and third party content in iFrames from affecting tests.
*/
iframe.media-oembed-content {
width: 0 !important;
height: 0 !important;
}

View File

@ -0,0 +1,6 @@
name: 'Test disable CSS animations'
type: module
description: 'Disables CSS animations for tests.'
package: Testing
version: VERSION
core: 8.x

View File

@ -0,0 +1,7 @@
testing.css_disable_transitions_test:
version: VERSION
css:
theme:
css/disable_transitions.theme.css: { weight: 100 }
js:
js/disable_transitions.theme.js: {}

View File

@ -0,0 +1,14 @@
<?php
/**
* @file
* Helper module for disabling animations in tests.
*/
/**
* Implements hook_page_attachments().
*/
function css_disable_transitions_test_page_attachments(array &$attachments) {
// Unconditionally attach an asset to the page.
$attachments['#attached']['library'][] = 'css_disable_transitions_test/testing.css_disable_transitions_test';
}

View File

@ -0,0 +1,3 @@
if (window.jQuery) {
jQuery.fx.off = true;
}

View File

@ -0,0 +1,10 @@
/**
* DO NOT EDIT THIS FILE.
* See the following change record for more information,
* https://www.drupal.org/node/2815083
* @preserve
**/
if (window.jQuery) {
jQuery.fx.off = true;
}

View File

@ -4,6 +4,7 @@ namespace Drupal\FunctionalJavascriptTests;
use Behat\Mink\Exception\DriverException;
use Drupal\Tests\BrowserTestBase;
use Symfony\Component\DependencyInjection\ContainerInterface;
use Zumba\GastonJS\Exception\DeadClient;
use Zumba\Mink\Driver\PhantomJSDriver;
@ -16,6 +17,16 @@ use Zumba\Mink\Driver\PhantomJSDriver;
*/
abstract class WebDriverTestBase extends BrowserTestBase {
/**
* Disables CSS animations in tests for more reliable testing.
*
* CSS animations are disabled by installing the css_disable_transitions_test
* module. Set to FALSE to test CSS animations.
*
* @var bool
*/
protected $disableCssAnimations = TRUE;
/**
* {@inheritdoc}
*
@ -61,6 +72,16 @@ abstract class WebDriverTestBase extends BrowserTestBase {
}
}
/**
* {@inheritdoc}
*/
protected function installModulesFromClassProperty(ContainerInterface $container) {
if ($this->disableCssAnimations) {
self::$modules = ['css_disable_transitions_test'];
}
parent::installModulesFromClassProperty($container);
}
/**
* {@inheritdoc}
*/