Shopee Real Price Highlighter [TAMPERMONKEY PLUGIN]

shopee_real_price_highlighter.js

// ==UserScript==
// @name         Shopee Real Price Highlighter
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Inverte o destaque visual entre o preço no Pix (isca) e o preço real (outros métodos) na Shopee.
// @author       Assistant
// @match        *://shopee.com.br/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Configurações de estilo para a inversão
    const STYLES = {
        highlighted: {
            fontSize: '1.75rem',
            color: '#ee4d2d', // Laranja padrão da Shopee
            fontWeight: '500',
            marginTop: '5px'
        },
        muted: {
            fontSize: '1rem',
            color: '#757575',
            fontWeight: 'normal',
            textDecoration: 'line-through' // Opcional: risca o valor do Pix
        }
    };

    const applyStyles = (element, styles) => {
        Object.assign(element.style, styles);
    };

    const swapPrices = () => {
        // Busca o parágrafo que contém o texto de "outros métodos"
        const allParagraphs = Array.from(document.querySelectorAll('p'));
        const altPriceEl = allParagraphs.find(p => 
            p.textContent.match(/Ou\s*R\$.+outros métodos/i) && !p.dataset.priceSwapped
        );

        if (!altPriceEl) return;

        // Limita a busca ao escopo da seção principal do preço para evitar falsos positivos
        const section = altPriceEl.closest('section');
        if (!section) return;

        // Encontra o preço principal do Pix buscando pelo formato monetário (ex: R$87,40)
        const allDivs = Array.from(section.querySelectorAll('div'));
        const pixPriceEl = allDivs.find(div => 
            div.textContent.trim().match(/^R\$\s*\d{1,3}(\.\d{3})*,\d{2}$/)
        );

        if (pixPriceEl) {
            // Inverte a hierarquia visual
            applyStyles(altPriceEl, STYLES.highlighted);
            applyStyles(pixPriceEl, STYLES.muted);
            
            // Marca o elemento como processado para otimizar o MutationObserver
            altPriceEl.dataset.priceSwapped = "true";
        }
    };

    // A Shopee é uma SPA (Single Page Application). O DOM é renderizado assincronamente.
    // O MutationObserver garante que a troca ocorra assim que a página injetar os dados do produto.
    const observer = new MutationObserver((mutations) => {
        let shouldCheck = false;
        for (let mutation of mutations) {
            if (mutation.addedNodes.length > 0) {
                shouldCheck = true;
                break;
            }
        }
        
        if (shouldCheck) {
            // Executa a função sem bloquear a thread principal
            requestAnimationFrame(swapPrices);
        }
    });

    // Inicia a observação no corpo do documento
    observer.observe(document.body, { childList: true, subtree: true });

})();