"new" Google 日历中的 MutationObserver

Question

我有一个 browser extension 用于 Google 日历，我在其中观察 DOM 以收集正在查看的事件：

// content.js
const calendarContainer = document.getElementById('gridcontainer');
const observer = new MutationObserver(mutations => {
  // just for test
  console.log('content', mutations);
}

observer.observe(calendarContainer, {
  childList: true,
  characterData: true,
  subtree: true
});

它在 "classic" 日历中工作正常，但自上次更新 Material 设计以来，DOM 结构有所不同。因此，我尝试相应地更改观察到的元素：

// content.js
const calendarContainer = document.querySelector('div[role="main"]');

即使我在 week/day 视图、日程表或日期之间切换，除了第一次加载页面（刷新后）之外，我无法收到任何新的变化。如果您通过 Developer Tools 查看源代码，您可以看到 DOM 正在发生变化，但 Observer 不知何故无法看到它。

有什么想法吗？

Answer 1

根据 wOxxOm 评论，我已更改它以观察 parentElement，它不会在不同的调用之间被替换，并且它正在工作。