🏦 Mercado Pago Test Page — Simulador Offline de Pagamentos (PIX e Cartão)

Esta é uma página HTML 100% offline para testar fluxos de pagamento do Mercado Pago, ideal para quem precisa validar integrações sem se preocupar com CORS, conexão com a internet ou servidores externos.

💡 Desenvolvida por @wiltonfrneto — perfeita para demonstrações, estudos e testes rápidos.

✨ Funcionalidades

• ✅ Simulação completa de PIX
  Gera QR Code visual, código PIX copiável e exibe todo o fluxo (geração, aguardando pagamento, aprovação).

• ✅ Simulação de pagamento com cartão de crédito
  Validação, processamento e aprovação com dados de teste pré‑preenchidos.

• ✅ Modo API real (experimental)
  Tenta conectar aos endpoints oficiais do Mercado Pago, com fallback automático para simulação em caso de erro de CORS.

• ✅ Totalmente offline
  Biblioteca de QR Code embutida no próprio código — zero dependências externas (sem CDN, sem scripts remotos).

• ✅ Interface moderna e responsiva
  Abas organizadas, painel de logs em tempo real, botões de cópia e feedback visual claro.

• ✅ Dados de teste inclusos
  Access token, public key e números de cartão já configurados (sandbox).

🚀 Como usar

1. Baixe o arquivo qrcode.html (ou copie o código fornecido).
2. Abra diretamente no seu navegador — nenhum servidor necessário.
3. Na aba "TESTE PIX" ou "TESTE CARTÃO", clique nos botões para iniciar as simulações.
4. Acompanhe o progresso no painel direito e os logs detalhados no painel esquerdo.

🧪 Exemplo de fluxo simulado

• PIX: após clicar em "INICIAR TESTE PIX SIMULADO", você verá:
  • QR Code gerado
  • Código PIX copiável
  • Mensagens de "Aguardando pagamento" e "Pagamento aprovado"
• Cartão: com os dados de teste, o sistema simula a aprovação em poucos segundos.

🔧 Modo API real

Caso queira testar com a API verdadeira do Mercado Pago:

1. Vá até a aba "AJUSTES".
2. Selecione "Modo API Real".
3. Informe seu access_token (o token de teste já vem preenchido).
4. Clique em "TESTAR API REAL" na aba PIX.

⚠️ Atenção: o navegador pode bloquear a requisição por CORS. A página tenta usar proxies de fallback, mas o modo simulação é o recomendado para uso geral.

📁 Estrutura do código

• Tudo em um único arquivo HTML com CSS e JavaScript embutidos.
• Função própria de geração de QR Code (simulado, mas visualmente parecido).
• Sistema de logs com cores e ícones para fácil depuração.
• Totalmente autocontido — pode ser enviado por e-mail, anexado em documentação ou usado em apresentações.

📸 Prévia

🤝 Contribuição

Sinta‑se à vontade para adaptar, melhorar ou usar este código em seus projetos. Se encontrar problemas ou tiver sugestões, abra uma issue ou envie um pull request.

---