使用转换样式时，Chrome中的文本损坏：preserve-3d;具有不透明度的旋转内容

Question

这是完成不透明度动画之前的样子：

当我尝试选择文本时会发生以下情况：

当我删除transform-style: preserve-3d;时，问题似乎消失了。

在线复制： https://jsfiddle.net/alvarotrigo/z7d0jhk2/22/

代码HTML：

<div class="section">
    <h1>Hello man!</h1>
    <h1>Hello man!</h1>
</div>

CSS：

.section {
    height: 500px;
    width: 100%;
    background: red;
    transition: transform 1000ms ease;
    display: table;
    table-layout: fixed;
   transform-style: preserve-3d;
}

.section.active {
    transform: rotate3d(1, 1, 0, 35deg);
}

h1,
.section {
    transition: opacity 10000ms ease;
}

h1 {
    opacity: 0;
    font-size: 8em;
}

h1.active {
    opacity: 1;
}

使用适用于Mac OS Mojave 10.14.3的最新稳定的Chrome版本73.0.3683.86（正式版本）（64位）。

我无法在Firefox或Safari中重现该错误。