howareyoutony / Reveal VIN

// ==UserScript==
// @name         Reveal VIN
// @namespace    https://openuserjs.org/users/howareyoutony
// @version      0.2
// @description
// @license      MIT
// @match        https://www.tesla.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=tesla.com
// @grant        none
// ==/UserScript==

(function () {
  'use strict';

  const style = document.createElement('style');
  style.type = 'text/css';
  const blurClassName = `element--${String(Math.random()).replace(/[^\d]/g, '')}`;
  const styles = `.${blurClassName} {
    filter: blur(3px);
    transition: filter .2s;
  }
  .${blurClassName}:hover {
    filter: none;
  }
  `;
  if (style.styleSheet) {
    style.styleSheet.cssText = styles;
  } else {
    style.appendChild(document.createTextNode(styles));
  }
  (document.querySelector('head') ?? document.body).appendChild(style);

  const revealVIN = () => {
    const links = Array.from(document.querySelectorAll('a[data-test^="teslaaccount-vehicle"]')).map((link) => ({
      link,
      vin: (/((5YJ|7SA)[3YSX][A-Z0-9]{13})/).exec(link.getAttribute('aria-label'))?.[1] ?? null,
    }));

    for (const { link, vin } of links) {
      const previousDivElement = link.parentNode.previousSibling;
      const referenceNumberElement = previousDivElement.lastChild;
      const vinElement = referenceNumberElement.cloneNode(true);
      if (vin) {
        const [identifier, ...rest] = vin.match(/.{1,12}/g);
        vinElement.innerHTML = `(VIN: ${identifier}<span class="${blurClassName}">${rest.join('')}</span>)`;
      } else {
        vinElement.textContent = `(VIN: ${vin})`;
      }
      const [first6DigitsOfReferenceNumber, ...restReferenceNumbers] = referenceNumberElement.textContent.match(/.{1,6}/g);
      referenceNumberElement.innerHTML = `${first6DigitsOfReferenceNumber}<span class="${blurClassName}">${restReferenceNumbers.join('')}</span>`;

      previousDivElement.appendChild(vinElement);
    }
  };

  const revealProductPageVIN = () => {
    const stringified = 'Tesla' in window ? JSON.stringify(window.Tesla) : document.documentElement.innerHTML;
    const regex = /vin":[\s]?(?<vin>null|"((5YJ|7SA)[3YSX][A-Z0-9]{13})")/igm;
    let match;
    let matchedVin;
    while (match = regex.exec(stringified)) {
      const vin = match.groups?.vin;
      if (typeof vin === 'string' && vin !== 'null') {
        matchedVin = vin.replace(/"/g, '');
        break;
      }
    }

    const referenceNumberElement = document.querySelector('#prod-final-deliver-desk-rn');
    const [first6DigitsOfReferenceNumber, ...restReferenceNumbers] = referenceNumberElement.textContent.match(/.{1,6}/g);
    referenceNumberElement.innerHTML = `${first6DigitsOfReferenceNumber}<span class="${blurClassName}">${restReferenceNumbers.join('')}</span>`;

    const vinElement = document.createElement('div');
    if (matchedVin) {
      const [identifier, ...rest] = matchedVin.match(/.{1,12}/g);
      vinElement.innerHTML = `(VIN: ${identifier}<span class="${blurClassName}">${rest.join('')}</span>)`;
    } else {
      vinElement.textContent = `(VIN: ${matchedVin})`;
    }
    referenceNumberElement.classList.remove('padding-bottom');
    vinElement.classList.add('padding-bottom');
    referenceNumberElement.insertAdjacentElement('afterend', vinElement);
  };

  window.addEventListener('load', () => {
    if (location.pathname.endsWith('/teslaaccount')) {
      setTimeout(revealVIN, 500);
    } else if (location.pathname.includes('/teslaaccount/product-finalize')) {
      setTimeout(revealProductPageVIN, 500);
    }
  }, false);
})();