Edges don't work when negative scaling is used (works in Drei <=0.101.0)

[nene]

• three version: 0.166.1
• @react-three/fiber version: 8.16.8
• @react-three/drei version: 9.108.4
• node version: 20.8.0
• npm version: 10.1.0

Problem description:

When using the following code to render a simple box with Edges applied:

function Box() {
  return (
    // Note the negative scaling
    <mesh position={[2, 0, 0]} rotation={[0.5, 0, 0]} scale={[-2, 2, 2]}>
      <boxGeometry args={[1, 1, 1]} />
      <Edges color="black" />
      <meshStandardMaterial color="orange" />
    </mesh>
  );
}

With Drei version 9.101.0, the edges are nicely rendered:

With Drei version 9.102.0 and above, the edges no more show up:

This only happens when negative scaling factor is used in the surrounding <mesh>.

Relevant code:

I created a repository that demonstrates this problem: https://github.com/nene/three-edges-react

Suggested solution:

Looks like there were major changes to Edges implementation in v9.102.0.

[TK009]

I had the same problem and made a workaround fix with side={THREE.DoubleSide} prop.