safari에서 zoomRatio가 적용이 안될 때

현재 켜져있는 창의 화면해상도(줌비율)가 100%이면 이벤트핸들러를 작동시키고 확대나 축소가 이루어지면 작동되지않도록 하는 것이 목표였다.

const zoomRatio = window.devicePixelRatio; 를 이용해서 구현했는데 크롬 등에서는 1이 아닌 값이 나오면 이벤트핸들러가 작동하지않았다.(올바른 목표! 콘솔창도 1.2 이렇게 잘 나왔다)

그러나, Safari 콘솔창을 띄워보니 zoomratio값이 1로만 나왔다.
고민하다 확대크기를 구할 수 있다는 내용을 보아서 확대값을 구했을 때 1이 아닌 값이 나오면 이벤트핸들러가 작동하지않도록!! 했다.

const zoomPoint = window.innerWidth / window.outerWidth; 이 확대값을 알 수 있는 코드이다.(내부넓이/바깥넓이)

 const isMac =
        /(Mac|iPhone|iPad)/i.test(navigator.platform) ||
        (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1);
      const isSafari =
        /^((?!chrome|android).)*safari/i.test(navigator.userAgent) &&
        navigator.vendor === "Apple Computer, Inc.";
      const isMacSafari = isMac && isSafari;

      console.log("vendor:", navigator.vendor);
      //safari면 Apple Computer, Inc. 이고 chrome이면 Google Inc.
      console.log("플랫폼:", navigator.platform);

      if (isMacSafari) {
        console.log("사파리 입니다");
      } else {
        console.log("사파리가 아닙니다");
      }
      const innerWidth = window.innerWidth;
      console.log("내부넓이", innerWidth);

      const zoomPoint = window.innerWidth / window.outerWidth;
      console.log("zoom", zoomPoint);

      const zoomRatio = window.devicePixelRatio; // 현재 화면의 확대/축소 비율
      //사파리는 window.devicePixelRatio가 항상 1을 반환한다.
      console.log("zoomRatio:", zoomRatio);
      if (
        (navigator.platform === "MacIntel" &&
          zoomRatio === 1 &&
          !isMacSafari) ||
        (!isMac && zoomRatio === 1) ||
        zoomPoint === 1
      ) {

이렇게 했더니 사파리에서도 원하는대로 잘나온다 ㅠㅠ