更新android chrome版本65后，应用程序无法运行，Sencha touch和cordova android

更新chrome版本65后，应用程序在录制一些点击事件时再次显示初始屏幕，这是一款混合应用程序Sencha touch和Cordova android。

编辑：这是一款标记为在chrome 67中修复的应用程序

编辑2：确认已固定在Chrome 67上。您需要在Android设备上更新“Android系统WebView”以获得修复

我相信这是一个Chrome 65错误

我有一个使用版本2.4.2部署的Sencha Touch应用程序。 大约一周前，我开始收到关于应用程序冻结的投诉

调试后，我发现这个快速修复通过禁用消息框上的动画绕过了这个问题（添加到app init，如app.js中）：

我仍然没有放弃我漂亮的动画，所以我一直在调试。几个小时后，问题似乎源于Chrome 65在非常特定的条件下围绕

window.getComputedStyle（）

的不同行为。 Sencha Touch使用内部带有隐藏div的隐藏iframe应用样式并获取应用值的计算值。然后，它使用这些计算值为消息框应用动画样式字符串。 您可以自己查看，在

touch/src/fx/runner/cstranition.js

中返回

getCssStyleValue

函数之前添加

console.log（value）

，然后显示一个消息框（Ext.Msg.alert）并单击“确定”。 Chrome 65将输出“无”，而Chrome 64则输出矩阵（1,0,0,1,0,0）。我测试了这个。请注意，如果逐行调试，错误将不会出现。这似乎是Chromium一方的竞争条件

我能够直接在浏览器上重现该问题，而无需使用Sencha Touch（）：

var-iframe=document.createElement（'iframe'）；
var iframeStyle=iframe.style；
setProperty（“可见性”、“隐藏”、“重要”）；
setProperty（'width'，'0px'，'important'）；
setProperty（'height'，'0px'，'important'）；
setProperty（'position'，'absolute'，'important'）；
setProperty（'border'，'0px'，'important'）；
setProperty（'zIndex'，'-1000'，'important'）；
document.body.appendChild（iframe）；
var iframeDocument=iframe.contentDocument；
iframeDocument.open（）；
iframeDocument.writeln（“”）；
iframeDocument.close（）；
var testElement=iframeDocument.createElement（'div'）；
testElement.style.setProperty（'position'，'absolute'，'important'）；
iframeDocument.body.appendChild（testElement）；
testElement.style.setProperty（“transform”、“translateX（0）translateY（0）translateZ（0）rotateX（0）rotateX（0）rotateZ（0）skewX（0）skewY（0）scaleX（1）scaleZ（1）”）；
var computed=window.getComputedStyle（testElement.getPropertyValue（“转换”）；
警报（计算）；

如果您仔细研究这个问题，您会发现只有当DIV位于iframe内部时，以及在这些特定条件下，才会发生这种情况。正如我所说，我的临时解决方案是禁用动画，但我现在将继续，并尝试向Chromium项目提交错误报告

不幸的是，我不喜欢拨弄这个senchatouch代码，试图找到另一种方法来获得计算值。我认为Sencha做了很多工作来确保所有这些东西都能跨浏览器工作，所以我真的希望这能在Chrome即将推出的版本中得到修复

我认为这是除了Grigoriy提到的Android8用户代理头错误之外，因为它也发生在Chrome的桌面版本上

我吸取了教训，确保定期在Chrome测试版或开发版上测试

---

希望这有帮助。

用setActiveItem替换了所有的AnimateActivItem并禁用了动画，然后它又开始工作。

我最近在Android Oreo上的Chrome中遇到了问题，由于

Ext.env.Browser

（我使用的是Extjs而不是sencha touch），网站没有启动。问题出现在用户代理标头中。试着朝那个方向看。谢谢你的回答，我已经删除了sencha触摸页面动画并直接设置了项目。this.getMainContainer（）.setActiveItem（卡片）；不是此代码，而是此.getMainContainer（）.animateActiveItem（卡片，动画）；更改代码后，我们发现了与此相关的另一个问题。（随机页面导航）。我做了同样的事情，我用setActiveItem替换了AnimateActivItem。我对Ext.Msg.alert也有一个问题，它在您第一次调用时起作用，第二次没有，第三次又开始起作用。@Prithiviraj如果这确实是您的问题，请将我的答案标记为正确。

Ext.Msg.defaultAllowedConfig.showAnimation = false;
Ext.Msg.defaultAllowedConfig.hideAnimation = false;

var iframe = document.createElement('iframe');
var iframeStyle = iframe.style;
iframeStyle.setProperty('visibility', 'hidden', 'important');
iframeStyle.setProperty('width', '0px', 'important');
iframeStyle.setProperty('height', '0px', 'important');
iframeStyle.setProperty('position', 'absolute', 'important');
iframeStyle.setProperty('border', '0px', 'important');
iframeStyle.setProperty('zIndex', '-1000', 'important');

document.body.appendChild(iframe);
var iframeDocument = iframe.contentDocument;

iframeDocument.open();
iframeDocument.writeln('</body>');
iframeDocument.close();

var testElement = iframeDocument.createElement('div');
testElement.style.setProperty('position', 'absolute', 'important');
iframeDocument.body.appendChild(testElement);

testElement.style.setProperty("transform", "translateX(0) translateY(0) translateZ(0) rotate(0) rotateX(0) rotateY(0) rotateZ(0) skewX(0) skewY(0) scaleX(1) scaleY(1) scaleZ(1)");

var computed = window.getComputedStyle(testElement).getPropertyValue("transform");

alert(computed);