Graphical issues with tippy.js (popper.js) resulting from positioning with transform in Chrome

Inside a tippy-js v6.3.7 tooltip, I have a 1px height div with background-color: #333. The div is randomly appearing blurred on some tooltips and not others. Removing the transform property on data-tippy-root fixes it but positions the tooltip in the upper-left.

I discovered the problem resulted from the transform property used to position the tooltip itself. Tippy v6 uses popper v2, which defaults to positioning this way. You can disable it via popper's gpuAcceleration setting. Here's how I fixed it through Tippy.

opts = {
    ...opts,
    popperOptions: {
        modifiers: [{
            name: 'computeStyles',
            options: {
                gpuAcceleration: false, // true by default
            },
        }]
    }
}

tp = tippy(elem, opts);

Firefox did not have this rendering problem, and both Chrome 94 and 96 did.