title: Which elements are observed by a given ResizeObserver?
body: <p><strong>Summary:</strong> Is there a way to get a list of the elements currently observed by a given <a href="https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver" rel="nofollow noreferrer">ResizeObserver</a>?</p>
  <p>Assume an existing ResizeObserver that observes some elements</p>
  
  <pre><code>let observer = new ResizeObserver(_ =&gt; _.forEach(_ =&gt; console.log(_.contentBoxSize[0])));
  observer.observe(document.getElementById('my-element-1');
  observer.observe(document.getElementById('my-element-2');
  </code></pre>
  <p>Is there a way to get the elements the ResizeObserver is observing like</p>
  
  <pre><code>observer.getObservedElements() === [ // this API does not exist
    document.getElementById('my-element-1'),
    document.getElementById('my-element-2')
  ];
  </code></pre>
  <p>Use cases that I would have used such an API (there are probably more):</p>
  <ul>
  <li>Consider a single generic ResizeObserver, shared in the whole application, that performs the same action for all observed elements (e.g. fire a framework-internal &quot;element resize&quot; event). No-one knows what elements are already observed. But I have to make sure that no already-observed element is observed again (otherwise I would get &quot;resize events&quot; twice).</li>
  <li>For testing purposes I need to assert that an element is observed. Mocking ResizeObserver would be a lot of effort and would probably interfere with other components that need the real ResizeObserver.</li>
  </ul>
  <p>Am I missing something from the <a href="https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver" rel="nofollow noreferrer">MDN docs</a> or the <a href="https://drafts.csswg.org/resize-observer/#resize-observer-interface" rel="nofollow noreferrer">CSSWG draft</a>? I only see <code>observe()</code>, <code>unobserve()</code> and <code>disconnect()</code>.</p>