Plotly.react leaves duplicate clippaths

const container = document.createElement('div');
document.body.appendChild(container);
await Plotly.newPlot(container, [], { title: 'abc' });
await Plotly.react(container, [], { title: 'hello' });

The resulting DOM contains multiple copies of the same clippath:

<clippath class="plotclip" id="clipc001dfxyplot">
  <rect height="270" width="540" />
</clippath>
...
<clippath class="plotclip" id="clipc001dfxyplot">
  <rect height="270" width="540" />
</clippath>

This is causing issues for our accessibility tests, which check that IDs are unique within the document, but in some cases the newer clippath is different (but still shares the same ID), so presumably the items which reference it could pick up an old value and therefore render incorrectly after an update.

(using Plotly 2.24.3)

Bắt đầu với bản tái hiện tối thiểu trong issue, so sánh DOM sau Plotly.newPlot và Plotly.react, đồng thời lần theo nơi các plotclip clippaths được tạo hoặc giữ lại. Hoàn tất khi biểu đồ đã cập nhật không có các ID clippath trùng lặp và các phần tử tham chiếu đến clippath dự kiến sau lần cập nhật.