ExtJS Modern：在 iOS 13.4+ WKWebview 中未触发绘制事件答案

【问题标题】：ExtJS Modern : Painted Event is not triggered in iOS 13.4+ WKWebviewExtJS Modern：在 iOS 13.4+ WKWebview 中未触发绘制事件
【发布时间】：2020-11-02 11:53:33
【问题描述】：

在 sencha Extjs 6.5.3 和 7.0.2 Modern 中，不会为所有组件和容器触发绘制事件，请找到下面的小提琴，当从 Android、Windows 甚至 Mac Safari 上单击时会增加，但在 iOS 上不会增加WKWebView（自定义）和 safari。

有没有办法根据 DOM 事件手动触发绘制事件或绘制事件的任何替代方法？它在 13.4 (iOS) 以下运行。

请找到这个Sencha Fiddle Sample

在 ios 13.5.1 中不工作

在桌面 chrome 和 Android 设备上运行良好..

【问题讨论】：

标签： javascript ios extjs wkwebview extjs6.5

【解决方案1】：

将此样式修复添加到 app.scss。感谢 Sencha 支持。

.x-paint-monitor.cssanimation {
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

现在工作正常。

【讨论】：

你好。 sencha 的网站上是否有任何关于该问题的票证、帖子或新闻？如果是的话，可以分享一下吗？
我从未如此高兴地找到关于 SO 的解决方案。这个问题让我的生活陷入了地狱。这个修复对我有用:)
此修复也与 sencha touch 相关，包括基于 Cordova 的项目
@coceban.vlad Ticket 是在 sencha 支持门户“EXTJS-29089”中提出的，不确定此问题的状态和发布。

【解决方案2】：

仅此一项对我们不起作用。

将此样式修复添加到 app.scss。感谢 Sencha 支持。
.x-paint-monitor.cssanimation {
   -webkit-animation-fill-mode: forwards;
   animation-fill-mode: forwards;
}
现在工作正常。

我们在所有 webkit 浏览器（Chrome、Edge、Brave、Android webview...）中都遇到了问题。

修复：将动画持续时间从 0.0001 毫秒增加到至少 0.001 毫秒（我们将其设置为 0.01 毫秒）。

.x-paint-monitor.cssanimation {
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 0.01ms;
    animation-duration: 0.01ms;
}

【讨论】：

【解决方案3】：

这个问题似乎在 Safari 14（iOS 和 Mac）中得到修复。

您的测试 Fiddle 在我的 iPhone 和 Mac 版本 14 上是绿色的。

【讨论】：

是的@Andre，得到了 sencha 支持的修复并在 fiddle 中进行了更新以对其进行测试，现在它可以正常用于组件。检查 index.html 文件以获取样式修复。会发在这里..
不确定这是由于 wkwebview 上的 iOS 13.4 + 升级或与 sencha 框架本身相关的问题。
即使在 iOS14 中也存在相同的“组件绘制事件未触发”。