mouse-helper/dist/mouse-helper.js

A tool to show mouse position and status for screenshots in automation test such as Puppeteer or Playwright

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("mouse-helper",[],t):"object"==typeof exports?exports["mouse-helper"]=t():e["mouse-helper"]=t()}(self,(()=>{return e={105:(e,t,o)=>{e.exports=function(e){if(!document.body)return console.log("Failed to create mouse helper, document.body not ready"),!1;const t=Object.assign({top:"0",left:"0",opacity:.8,className:"mouse-helper-container"},e);let s=document.querySelector(`.${t.className}`);if(s)return!0;const M=o(228),i=o(556);s=document.createElement("div"),s.className=t.className,s.style.cssText=`top: ${t.top}; left: ${t.left}; opacity: ${t.opacity}; position: absolute; z-index: 99999; user-select: none; pointer-events: none;`;const n=document.createElement("img");n.src=i,n.style.cssText="position: absolute; top: -10px; left: -10px; width: 20px; height: 20px; display: none;",s.appendChild(n);const u=document.createElement("img");let c,a;return u.src=M,u.style.cssText="position: absolute; top: 0; left: -3px; width: 20px; height: 20px; display: none;",s.appendChild(u),document.body.appendChild(s),document.addEventListener("mousemove",(function(e){c||(c=!0,u.style.display="block"),window.cancelAnimationFrame(a),a=window.requestAnimationFrame((()=>{s.style.left=`${e.pageX}px`,s.style.top=`${e.pageY}px`}))})),document.addEventListener("mousedown",(function(){n.style.display="block"})),document.addEventListener("mouseup",(function(){n.style.display="none"})),!0}},556:e=>{"use strict";e.exports="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiI+DQogICAgPGNpcmNsZSBmaWxsPSJyZWQiIGN4PSIxNiIgY3k9IjE2IiByPSIxMCIgLz4NCiAgICA8Y2lyY2xlIHN0cm9rZT0icmVkIiBmaWxsPSJub25lIiBzdHJva2Utd2lkdGg9IjIiIGN4PSIxNiIgY3k9IjE2IiByPSIxNCIgLz4NCjwvc3ZnPg=="},228:e=>{"use strict";e.exports="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj4NCiAgICA8cGF0aCBmaWxsPSIjZmZmIiBzdHJva2U9IiMwMDAiIHN0cm9rZS13aWR0aD0iMjAiIGQ9Ik00MjMuNTQ3LDMyMy4xMTVsLTMyMC0zMjBjLTMuMDUxLTMuMDUxLTcuNjM3LTMuOTQ3LTExLjYyNy0yLjMwNHMtNi41OTIsNS41NDctNi41OTIsOS44NTZWNDgwYzAsNC41MDEsMi44MzcsOC41MzMsNy4wODMsMTAuMDQ4YzQuMjI0LDEuNTM2LDguOTgxLDAuMTkyLDExLjg0LTMuMjg1bDg1LjIwNS0xMDQuMTI4bDU2Ljg1MywxMjMuMTc5YzEuNzkyLDMuODgzLDUuNjUzLDYuMTg3LDkuNjg1LDYuMTg3YzEuNDA4LDAsMi44MzctMC4yNzcsNC4yMDMtMC44NzVsNzQuNjY3LTMyYzIuNjQ1LTEuMTMxLDQuNzM2LTMuMjg1LDUuNzYtNS45NzNjMS4wMjQtMi42ODgsMC45MzktNS42NzUtMC4yNzctOC4yOTlsLTU3LjAyNC0xMjMuNTJoMTMyLjY3MmM0LjMwOSwwLDguMjEzLTIuNjAzLDkuODU2LTYuNTkyQzQyNy41MTUsMzMwLjc1Miw0MjYuNTk4LDMyNi4xODcsNDIzLjU0NywzMjMuMTE1eiIvPg0KPC9zdmc+"}},t={},function o(s){var M=t[s];if(void 0!==M)return M.exports;var i=t[s]={exports:{}};return e[s](i,i.exports,o),i.exports}(105);var e,t}));