代码之家 › 专栏 › 技术社区 › paul

如何关闭css以加快自动化测试的执行?

selenium-webdriver css javascript

paul · 技术社区 · 6 年前

参考:

每当我需要运行测试javascript时 JavascriptExecutor 但是上面的博客都没有说明如何使用它。

我试过:

js.executeScript(".notransition {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}");

但这对我毫无帮助。

编辑:

我尝试了@ AmerllicA提供的答案。

public void turnOffCss () {
    navigate("https://www.bureauofdigital.com");
    js.executeScript("*, *:before, *:after {
     -webkit-transition: none !important;
     -moz-transition: none !important;
     -ms-transition: none !important;
     -o-transition: none !important;        
     transition: none !important;

     -webkit-transform: none !important;
     -moz-transform: none !important;
     -ms-transform: none !important;
     -o-transform: none !important;        
     transform: none !important;
    }");
}

2 回复 | 直到 6 年前

AmerllicA 6 年前

我对你的确切问题作了另一个回答 JavaScript Executor 是的。让我们澄清一下 JavaScript 代码,

做一个 style 标记元素。
添加 id 属性 style-tag 价值。
把它串起来 CSS 是的,我用另一个答案回答。
将字符串放入或附加到 风格 标签。
附加 风格 到 head 加入 DOM 是的。

现在让我们把上面的状态写到 javascript 代码:

const styleElement = document.createElement('style');
styleElement.setAttribute('id','style-tag');
const styleTagCSSes = document.createTextNode('*,:after,:before{-webkit-transition:none!important;-moz-transition:none!important;-ms-transition:none!important;-o-transition:none!important;transition:none!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important;-o-transform:none!important;transform:none!important}');
styleElement.appendChild(styleTagCSSes);
document.head.appendChild(styleElement);

用这些代码你可以导入我的另一个答案 CSS ES到 多姆 是的。所以你可以把下面的字符串放到 javascript执行器 以下内容:

"const styleElement = document.createElement('style');styleElement.setAttribute('id','style-tag');const styleTagCSSes = document.createTextNode('*,:after,:before{-webkit-transition:none!important;-moz-transition:none!important;-ms-transition:none!important;-o-transition:none!important;transition:none!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important;-o-transform:none!important;transform:none!important}');styleElement.appendChild(styleTagCSSes);document.head.appendChild(styleElement);"

如果要还原此操作,请使用:

document.getElementById('style-tag').remove();

希望这些代码能帮助你。

AmerllicA 6 年前

你的题目是 How to turn of CSS 这意味着什么?如果您的意思是所有转换使用下面的代码:

*, *:before, *:after {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;        
    transition: none !important;
}

我想你的通道就在附近 JavaScript 所以你不能进入 :before 或 :after 所以加上 * 到 CSS 全部省略 transitions 是的。

但有些动画和可爱的动作是由 transform translate CSS 属性方法,因此如果要忽略所有动画和运动,必须使用以下代码:

*, *:before, *:after {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;        
    transition: none !important;

    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important;        
    transform: none !important;
}

这个代码完全粉碎了所有的网站用户界面,但可能帮助你运行你的测试。