codeMirror代码编辑器，如何定位并在编辑区域输入内容

背景

最近在写UI自动化，发现普通的方法不能在CodeMirror编辑器里面输入内容，只能通过JS的方式输入内容。
于是琢磨了一下selenium和playwright这2种自动化工具，在CodeMirror编辑器里面输入内容的差别。

注意：这里在定位CodeMirror编辑器时，我们需要定位的是textarea下方的div元素。定位错误会导致JS无法正确执行。
具体参考下图。

selenium

elem = driver.find_element_by_xpath("//textarea/following::div[contains(@class,'CodeMirror-wrap')]")
# elem是元素， content是输入的内容
driver.execute_script("arguments[0].CodeMirror.setValue(arguments[1]);", elem, content)

playwright

# 由于编辑器加载慢，我增加了一个等待
page.wait_for_timeout(1000)
# wait_for_selector和query_selector都可以
# elem = page.wait_for_selector(
        selector="//textarea/following::div[contains(@class, 'CodeMirror-wrap')]")
elem = page.query_selector(selector="//textarea/following::div[contains(@class, 'CodeMirror-wrap')]")
# elem是元素， content是输入的内容
page.evaluate('''([elem, content]) => elem.CodeMirror.setValue(content);''',
                  [elem, content])