chrome活久见渲染bug,前所未见!!!
异常实况如动态所示非常让人难崩的异常状况。场景说明vue框架根容器是绿色背景容器里渲染一个地图canvas,canvas上叠加一个div工具栏红色背景的然后工具栏对称的上方会出现一个和工具栏同等大小关于水平中轴对称的的canvas镂空把根容器颜色露出来。代码结构如下声明没有任何js修改div的代码且从动图来看有明显的渲染失常效果canvas在代码层面除非手动修改否则不可能出现局部镂空三层结构仅使用了绝对定位和transform,并且在edge表现正常。经测试无论工具栏如何调整位置上方镂空部分都会同步移动并且更离谱的是将工具栏复制一份镂空区域也会自动复制一份如果是将复制的一份稍微左右移动或者分离与EDGE对比效果左侧chrome版本 148.0.7778.97,右侧edge 版本 147.0.3912.98初步判断是渲染工具栏的时候未正常获取其位置取的对称高度导致预留出一块错误位置的加载区域canvas渲染的时候因为改区域被异常占用所以跳过该区域的渲染并不熟悉完全的渲染流程和机制纯属猜测单凭两个浏览器的对比结果来看就不是代码层面的问题应该是浏览器异常。再次声明所有常规测试手段均用过或许是浏览器的某个配置问题更离谱的是个人电脑换过一次键盘换键盘之前chrome表现也是正常的。。。。。。另不光是以上表现还有以下和非页面元素交互也会触发已加载页面内容渲染异常