4.1 KiB

Raw Blame History

🚀 Debug Rápido - PROBLEMA DO CAMPO NUMBER RESOLVIDO!

✅ Status

✅ Servidor rodando em http://localhost:4200
✅ Logs de debug habilitados
✅ Source maps configurados
✅ Helpers de debug carregados
✅ Warning do Chrome resolvido
✅ Campo number corrigido no getAddressData()

🎯 Como Debugar AGORA

1. Abrir DevTools

http://localhost:4200
Pressionar F12 (ou Cmd+Option+I no Mac)

2. Ver Logs em Tempo Real

No Console, você verá automaticamente:

🎯 AÇÃO CLICADA: quando clicar em editar
🔄 [EDIT] Iniciando edição quando abrir aba
🎯 [TAB] Selecionando sub-aba quando trocar entre Dados/Endereço
📍 [ADDRESS] Dados de endereço após inicialização - NOVO LOG ESPECÍFICO

3. Colocar Breakpoints

Na aba Sources:

Procurar: webpack:// → ./projects/idt_app/src/app/domain/drivers/drivers.component.ts
Breakpoint linha ~533: onActionClick(event: { action: string; data: any }) {
Procurar: webpack:// → ./projects/idt_app/src/app/shared/components/generic-tab-form/generic-tab-form.component.ts
Breakpoint linha ~937: getAddressData(): AddressData {

4. Opções de Debug no Cursor/VS Code

Agora você tem 3 opções no menu de debug:

🚀 Debug Angular (idt_app) - Debug completo com todas as funcionalidades
🔧 Debug Angular (Seguro) - Debug sem warnings do Chrome
🔗 Attach to Chrome - Conectar a uma instância existente

5. Testar com Console - NOVO COMANDO ESPECÍFICO

// Debug específico do endereço - NOVA FUNÇÃO!
debugHelpers.debugAddressData();

// Simular edição de motorista
debugHelpers.simulateEditClick('123');

// Ver estado do formulário
debugHelpers.showFormState();

// Trocar para aba endereço
debugHelpers.switchSubTab('endereco');

// Teste completo automatizado
debugHelpers.testCompleteFlow();

⚡ Teste Específico do Campo Number - 30 segundos

Abrir http://localhost:4200
F12 para DevTools
Console digite: debugHelpers.simulateEditClick('test-456')
Aguarde a aba de edição abrir
Console digite: debugHelpers.debugAddressData()
Observe a tabela comparativa mostrando os valores
Clique na aba "Endereço"
Verifique se o campo número está preenchido com "123"

🔍 Logs Principais a Observar

🐛 [DriversComponent] 🎯 AÇÃO CLICADA: {action: "edit", data: {...}}
🐛 [DriversComponent] 🔄 [EDIT] Iniciando edição de motorista
🐛 [GenericTabForm] 🔄 [INIT] GenericTabFormComponent ngOnInit iniciado  
🐛 [GenericTabForm] 📍 [ADDRESS] Dados de endereço após inicialização
🐛 [GenericTabForm] 🎯 [TAB] Selecionando sub-aba {from: "dados", to: "endereco"}

✅ Problema do Campo Number Resolvido!

🐛 O que estava acontecendo:

Campo address_number não aparecia no getAddressData()
Mapeamento incompleto no onAddressDataChange()
Dados não estavam sendo passados para o AddressFormComponent

✅ O que foi corrigido:

✅ Adicionado number: this.form.get('address_number')?.value || '' no getAddressData()
✅ Adicionado address_number: data.number no onAddressDataChange()
✅ Logs específicos para debug de endereço
✅ Dados de teste com número "123" para verificação
✅ Nova função debugHelpers.debugAddressData() para análise detalhada

🧪 Para verificar se está funcionando:

// No console do DevTools
debugHelpers.debugAddressData();
// Deve mostrar tabela com number: "123" em todas as colunas

✅ Warning do Chrome Resolvido

O warning "Web security may only be disabled..." foi resolvido com:

✅ Configuração correta do userDataDir
✅ Pasta .vscode/chrome-debug-user-data/ criada
✅ Adicionada ao .gitignore
✅ Opção de debug "seguro" sem warnings

💡 Dica de Ouro

Se breakpoints não funcionarem:

Ctrl+Shift+R (refresh forçado)
F12 fechar/abrir DevTools
Buscar arquivo digitando Ctrl+P → drivers.component.ts
Usar a opção "🔧 Debug Angular (Seguro)" se houver problemas

4.1 KiB Raw Blame History