项目没发版却出现了bug，原来是chrome春节前下毒

项目背景

这个功能是属于一个基础功能，通过 npm 私有仓库维护版本
这个基础功能呢，很多项目中都在使用。
如果基础功能发了新版本，业务部门不进行升级安装，那么这个业务线的项目也是不会出问题的。所以只要线上出了问题，那么要满足两个条件
1、基础功能进行了发布了 npm 新版本，且这个版本有问题，
2、业务部门进行了升级，使用了这个新版本

排查问题

一般来说：造成问题的可能性有

有人发过新迭代版本
是不是存在莫名的缓存
有人在以前的版本里面下毒了，然后现在发作了（可能性不大）

经过粗略排查

猜测 | 结果
1、发版导致？ | 近期两周，该服务部分未更新，排除
2、缓存导致 | 已经清理，没用，排除
3、下毒了 | 看了相关代码，没什么问题，排除

问题初见端倪

接着发生了两件事情

1、然后本地跑了一下项目的时候，在操作的时候，存在报错。
2、一个测试反馈说可以正常操作

莫不是浏览器兼容问题了吧。
去看了一下，都是 chrome 浏览器（这个项目只支持到 chrome 就可以）
这时感觉可能问题有点大了，莫不是 chrome 又调整了吧
点开测试版本看了下，是 108，而且处于重启就会升级的状态。
赶紧回到我的工位，打开电脑发现是 109。

在看了下那个报错, event.path 为 undefined, 这里先介绍下 path 是个什么玩意，他是一个数组，里面记录着从当前节点冒泡到顶层 window 的所有 node 节点。借助这个功能做了一写事情。。。
这直接被 chrome 釜底抽薪了。（path 属于非标准 api, 这些非标准 api 慎用，说不定什么时候就嘎了）

解决问题

问题一

既然是 event.path 没了，那么怎么办呢，首先得找到代替 path 的方法， 上面也说了，path 里面记录的是从当前节点冒泡到顶层 window 的所有 node 节点（是拖拽事件）

那么可以自己遍历一下当前节点+他的父节点+父节点的父节点+...+window

let path = [];
let target = event.target;
while (target.parentNode !== null) {
  path.push(target);
  target = target.parentNode;
}
path.push(document, window);
return path;

在项目里面试了一下，很稳定。

问题二

但是又遇到了第二个问题，使用到 event.path 的项目还比较多，如果没有更好的方法，那么只能挨个项目改，然后测试，然后逐个项目发版
这种原始的方法肯定是不会采用的，换个思路，既然 event 下的 path 被删除了，那么在 event 对象下追加个一个 path 属性就可以了
当然要记得判断下 path 属性是否存在，因为有部分用户的 chrome 是老版本的，只对升级后的版本做一些兼容就可以了

if (!Event.prototype.hasOwnProperty("path")) {
  Object.defineProperties(Event.prototype, {
    path: {
      get: function () {
        var target = this.target;
        console.log("target", target);
        var path = [];
        while (target.parentNode !== null) {
          path.push(target);
          target = target.parentNode;
        }
        path.push(document, window);
        return path;
      },
    },
    composedPath: {
      value: function () {
        return this.path;
      },
      writable: true,
    },
  });
}

这样，只需要在每个项目的根 html，通过 script 引入这个 js 文件就可以了