✅#0324-000352: Bug no Mini Cart - Entregue 16.04.24
Bug no Mini Cart
Previous#0324-000240: Alterar o tamanho do cupom de primeira compra no Mobile - Entregue 11.04.24Next#0324-000312: Bug no Selo - Entregue 17.04.24
Last updated
Bug no Mini Cart
Last updated
Boa tarde,
Estamos com um bug, no mini cart do mobile. Ao entrar no mini cart no mobile, a página fica "sobreposto" a outra...as informações da página do site ficam "passando" no segundo plano mesmo com o mini cart aberto...ao "rolar" o mini cart você consegue ver a página passando no "segundo plano"
Segue vídeos para exemplificar no anexo...
Retorno agência...27/03/2024 14:50:11 via Desk Manager
Olá, Ana! Como vai? Espero que esta mensagem te encontre bem! :) Este chamado está sendo encaminhado à equipe de desenvolvimento para análise técnica. Ana, assim que houver uma resposta da equipe, iremos lhe retornar com todas as informações, combinado? Nossa devolutiva deverá ocorrer o mais breve possível. Agradecemos antecipadamente por aguardar.
02/04/2024 11:13:45 Via Portal do Solicitante
Bom dia, tudo bem? Novidades nessa correção por favor...
Retorno agência 02/04/2024 16:19:34 via Desk Manager
Olá, Ana. Boa tarde! Como vai?! Muito obrigado pelo retorno!! Estou enviando este caso ao time de desenvolvimento, para que possamos concluir esta implementação em nossa sprint entre os dias 08/04 e 12/04, combinado?! Enquanto isso, caso tenha qualquer dúvida, não deixe de nos comunicar!!
Retorno agência 05/04/2024 16:11:42 via Desk Manager
Boa tarde Ana, tudo bem?
Estou começando a trabalhar nesta demanda agora:
- Ajuste minicart mobile (scroll)
Informarei qualquer atualização por aqui.
Retorno agência 08/04/2024 14:45:20 via Desk Manager
Boa tarde Ana, tudo bem?
Concluí o desenvolvimento desta demanda e encaminhei para análise da nossa equipe interna de QA.
Informarei sobre qualquer atualização por aqui.
Estou à disposição para quaisquer dúvidas!
Atenciosamente,
Fé Souza
Retorno agência 09/04/2024 09:03:36 via Desk Manager
Bom dia Ana, tudo bem?
Concluí o desenvolvimento desta demanda. Segue o link de homologação (link de teste) para validação e aprovação:
Link de homologação: https://deco-sites-lojastorra-2--c0324000352.deno.dev/
Lembre-se de que o link acima é para testes mobile e desktop, e a demanda só será implementada na loja em produção após a validação e aprovação.
Esse chamado é o relacionado ao scroll no mobile, que no caso era o scroll da página ao abrir o minicart. Eu aproveitei e já arrumei o scroll ao abrir o menu mobile também
09/04/2024 09:59:03 Via Portal do Solicitante
Bom dia, tudo bem? Testamos e ainda continua aparecendo o "segundo plano", quando colocamos um produto no mini cart, ao deslizar a tela, a parte de baixo ainda aparece, no mobile (alguns momentos aparece laranja, outras o botão de comprar, outras "produtos"), testamos no IOS e no Android... Segue um vídeo em anexo...
Retorno agência 09/04/2024 12:29:28 via Desk Manager
Bom dia Ana, tudo bem?
Entendemos agora qual o problema, no entanto, isso é algo que não temos como resolver, por ser uma funcionalidade dos navegadores dentro dos celulares, que acontece pela funcionalidade de "clicar - agarrar - arrastar" que existe nos aparelhos
Perceba que acontece por conta do menu do navegador que fica na parte de baixo do celular, e como esse menu fica subindo e descendo conforme a navegação do usuário, o container do minicart tenta acompanhar esse tamanho
Quando o container do minicart tenta acompanhar o tamanho da tela, existe um delay para ele "entender" que o tamanho que precisa preencher mudou, e é nesse momento do delay que a parte de baixo da loja é exibida momentaneamente ou enquanto o usuário continua "agarrando e puxando" o container, e não temos como alterar esse delay por ser algo nativo dos navegadores
09/04/2024 14:56:18 Via Portal do Solicitante
Boa tarde, tudo bem Fé Entendemos, mas analisando aqui com nosso front, ele nos sugeriu se não conseguimos quando abrir o mini cart travar o scroll da página. Um outro ponto no elemento aside que tem a classedrawer-side podemos aumentar o height de 100% para um tamanho maior (120%), para "cobrir" o segundo plano.
Retorno agência 10/04/2024 12:00:43 via Desk Manager
Bom dia Ana, tudo bem?
Vamos lá, quanto a parte de quando estiver com o minicart aberto tirar o scroll da página, eu já estou fazendo isso desde o início do chamado hahahaha (rindo, mas é de desespero hahaha) é que mobile é bem complicado, os navegadores tem uns comportamentos que não controlamos e que são meio estranhos hahaha
O que eu tentei agora fazer, foi a segunda sugestão de vocês, então eu aumentei a parte de trás, a aside, para uma altura de 150%
Testei aqui e ainda ocorreu esse problema quando o minicart está vazio, mas quando o minicart está com produto, eu não consegui mais forçar para esse problema ocorrer novamente
Segue o link de homologação para vocês validarem novamente: https://deco-sites-lojastorra-2--c0324000352.deno.dev/
Fico no aguardo
Att,
Fé Souza
15/04/2024 08:08:14 Via Portal do Solicitante
Bom dia, tudo bem? Vamos validar e retorno...obrigada
Retorno agência 15/04/2024 09:10:40 via Desk Manager
Bom dia Ana, tudo bem?
Fico no aguardo : )
15/04/2024 09:17:27 Via Portal do Solicitante
Oi Fe, bom dia, tudo bem? Validado, pode subir para produção por favor.
Retorno agência 15/04/2024 10:29:40 via Desk Manager
Bom dia Ana, tudo bem?
Acabei de implementar este chamado na loja. Poderia, por gentileza, verificar como ficou?
Lembre-se, este chamado incluiu os seguintes pontos:
1. Ajuste minicart mobile (scroll)
Estou à disposição para qualquer dúvida!
Atenciosamente,
Fé Souza
15/04/2024 11:02:02 Via Portal do Solicitante
Bom dia, tudo bem e você? Fizemos o teste, e "quebrou" o continuar comprando. Ao clicar ele não "permite" clicar no continuar comprando =/ Segue vídeo exemplificando no anexo...
Retorno agência 15/04/2024 12:49:38 via Desk Manager
Bom dia Ana,
Eu removi todas as alterações desse chamado para parar de impactar no fluxo de compra
Testei em 5 modelos de celular e não consegui reproduzir o problema
Poderia por gentileza me informar qual o modelo de celular que foi feito esse teste, juntamente com o navegador usado, por gentileza
Fico no aguardo
Att,
Fé Souza
15/04/2024 13:46:15 Via Portal do Solicitante
Boa tarde, Iphone 14 - Safari
15/04/2024 15:21:46 via Desk Manager
Boa tarde Ana,
O que causou essa quebra foi justamente aumentar a aside para a altura de 150%. Testei antes no nosso emulador, de fato estava com a quebra. Retirei a altura de 150% da aside e voltei para 100%, rodei no emulador novamente, e a quebra parou
Como não possuímos um iPhone 14 físico para teste, por gentileza testar nesse link de homologação para ver se resolveu a quebra: https://deco-sites-lojastorra-2--c0324000352.deno.dev/
Lembrando que, retirando o 150% da aside, vai voltar a aparecer a parte de trás no minicart quando a barra de opções do navegador for na parte inferior (exemplo no Safari)
15/04/2024 16:14:57 Via Portal do Solicitante
Fe tudo bem? O mini cart do concorrente - CEA (vídeo no anexo), apresenta o comportamento que era o que queríamos... O mini cart da Speedo tb tem o mesmo comportamento. (vídeo no anexo) O nosso mini cart o maior problema é o srcoll. ao clicar para abrir o mini cart é necessário adicionar esse css: html, body{ overflow: hidden !important; }
Retorno agência 16/04/2024 11:55:50 via Desk Manager
Bom dia Ana, tudo bem?
A sugestão de código encaminhada já estava sendo usada a parte do body, agora acrescentei a parte do HTML, conforme pode ser visto abaixo. Quando o minicart está aberto, o body e o html recebem um overflow hidden:
Precisei alterar mais algumas coisas porque o minicart ficou com um comportamento lateral bem estranho quando coloquei o overflow no html, MAS achamos que agora ficou resolvido o problema (testei e pedi ao Gabriel que testasse também - ambos os testes em Safari, no Iphone)
Segue o novo link de homologação para testes: https://deco-sites-lojastorra-2-01a9xbzc3fqc.deno.dev/
------
Com relação as lojas encaminhadas como exemplo, esse problema ocorre ainda em ambas hahaha abaixo segue minha análise em relação as concorrentes (vídeos em anexo)
Observe que todos os meus testes ocorrem em dois momentos diferentes: o primeiro sendo abrindo o minicart no header full (ou seja, no topo da tela), e outra vez abrindo o minicart no meio da página
Vídeo 1 - Torra em produção
Ao abrir o minicart no topo da tela a quebra acontece, e ao abrir o minicart no meio da página, a quebra continua acontecendo
Vídeo 2 - Speedo (Loja Agência e-Plus - Vtex IO)
Ao abrir o minicart no topo da tela a quebra não acontece, porém, ao abrir o minicart no meio da página, a quebra acontece
Vídeo 3 - CEA (Loja de Agência concorrente - Vtex IO) - (Teste na página de produto, pois a CEA não possui micro header)
Ao abrir o minicart no topo da tela a quebra não acontece, porém, ao comprar um produto, o minicart abre no meio da página, e a quebra acontece
Vídeo 4 - Hering (Loja de Agência concorrente - Vtex IO)
Ao abrir o minicart no topo da tela a quebra não acontece, porém, ao abrir o minicart no meio da página, a quebra acontece
Vídeo 5 - ZeeDog (Loja de Agência concorrente - DECO)
Ao abrir o minicart no topo da tela a quebra não acontece, porém, ao abrir o minicart no meio da página, a quebra acontece
Vídeo 6 - Torra - NOVO LINK DE HOMOLOGAÇÃO
Ao abrir o minicart no topo da tela a quebra não acontece, e ao abrir o minicart no meio da página, a quebra também não acontece mais Fico no aguardo!
Att,
Fé Souza
16/04/2024 14:01:18 Via Portal do Solicitante
Boa tarde, Fe...tudo bem? Coloca em produção póor favor =D
Retorno 16/04/2024 14:36:53 via Desk Manager
Boa tarde Ana, tudo bem?
Acabei de implementar este chamado na loja. Poderia, por gentileza, verificar como ficou?
Lembre-se, este chamado incluiu os seguintes pontos:
1. Ajuste minicart mobile (scroll)
16/04/2024 15:06:34 Via Portal do Solicitante
Boa tarde, Fe... Validado =D Muiiito obrigada...
Entregue 16/04/2024
