H5 下浏览器废弃事件处理，诸如 DOMNodeInserted、DOMNodeRemoved 事件等，需进行修复

[iocool]

相关平台

H5

浏览器版本: chrome 128.0.6613.85
使用框架: React

复现步骤

编译为H5平台后,浏览器控制台会提示当前使用的诸如 DOMNodeInserted、DOMNodeRemoved 事件即将废弃

后定位错误信息位置,为 taro 中的 swiper 组件中使用了上述事件

期望结果

移除相关废弃事件,改用浏览器现阶段支持的事件

实际结果

以下是浏览器控制台错误信息

[Deprecation]Listener added for a 'DOMNodeInserted' mutation event. Support for this event type has been removed, and this event will no longer be fired. See https://chromestatus.com/feature/5083947249172480 for more information.


[Deprecation]Listener added for a 'DOMNodeRemoved' mutation event. Support for this event type has been removed, and this event will no longer be fired. See https://chromestatus.com/feature/5083947249172480 for more information.

环境信息

Taro v3.6.2


  Taro CLI 3.6.2 environment info:
    System:
      OS: macOS 14.6.1
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 16.20.2 - /usr/local/bin/node
      Yarn: 1.22.10 - /usr/local/bin/yarn
      npm: 8.19.4 - /usr/local/bin/npm
    npmPackages:
      @tarojs/cli: 3.6.2 => 3.6.2 
      @tarojs/components: 3.6.2 => 3.6.2 
      @tarojs/helper: 3.6.2 => 3.6.2 
      @tarojs/plugin-framework-react: 3.6.2 => 3.6.2 
      @tarojs/plugin-html: ^3.6.2 => 3.6.35 
      @tarojs/plugin-platform-alipay: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-h5: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-jd: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-qq: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-swan: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-tt: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-weapp: 3.6.2 => 3.6.2 
      @tarojs/react: 3.6.2 => 3.6.2 
      @tarojs/runtime: 3.6.2 => 3.6.2 
      @tarojs/shared: 3.6.2 => 3.6.2 
      @tarojs/taro: 3.6.2 => 3.6.2 
      @tarojs/taro-h5: ^3.6.2 => 3.6.2 
      @tarojs/webpack5-runner: 3.6.2 => 3.6.2 
      babel-preset-taro: 3.6.2 => 3.6.2 
      eslint-config-taro: 3.6.2 => 3.6.2 
      react: ^18.0.0 => 18.3.1 

---

补充信息

目前定位到的使用相关废弃事件的代码路径

packages/taro-components/src/components/swiper/swiper.tsx

第 195 行

    this.el.addEventListener('DOMNodeInserted', this.handleSwiperSizeDebounce)
    this.el.addEventListener('DOMNodeRemoved', this.handleSwiperSizeDebounce)
    this.el.addEventListener('MutationObserver', this.handleSwiperSizeDebounce)

[TheKonka]

v4 已经删除了这块代码

[iocool]

v4 已经删除了这块代码

是的，但是目前我们项目使用的依旧是3.X的版本，暂时没有迁移4的计划

[ZEJIA-LIU]

4.0.5的swiper已经进行升级了，移除了这些废弃的api～感谢反馈

[iocool]

4.0.5的swiper已经进行升级了，移除了这些废弃的api～感谢反馈

@ZEJIA-LIU 请问3.X版本是不在考虑修复了嘛,我目前项目使用的都是3.X的版本,意味着我项目现在只能升级到4的版本么