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)

Issue 内の最小再現から始め、Plotly.newPlot と Plotly.react の後の DOM を比較し、plotclip clippaths がどこで作成または保持されるかを追跡します。更新されたプロットに重複した clippath ID がなく、更新後に要素が意図した clippath を参照していれば完了です。