Este problema conhecido foi traduzido automaticamente do inglês.
Sumário
O valor da largura do seletor de SKU é quebrado quando displayMode="slider" é usado para produtos indisponíveis e sliderItemsPerPage é configurado usando valores min-width.
Simulação
Instale o aplicativo vtex.responsive-values no espaço de trabalho ou configure um bloco responsive-values em seu tema para fornecer valores com base em pontos de interrupção de largura mínima.
Configure a propriedade sliderItemsPerPage do seletor de SKU usando o padrão responsive-values:
Essa configuração usa pontos de interrupção de largura mínima e é baseada no aplicativo responsive-values, que não é oficialmente compatível com o seletor de SKU.
Implemente essa configuração em uma página de detalhes do produto (PDP) que não tenha SKUs disponíveis (ou seja, todas as SKUs estão fora de estoque).
Acesse o PDP no espaço de trabalho e confirme que o seletor de SKU é renderizado em displayMode="slider".
- Observe o resultado: o carrossel de SKUs quebrará - os itens terão larguras incorretas, muitas vezes transbordando ou não sendo renderizados como esperado
Workaround
Substitua a configuração sliderItemsPerPage usando as chaves min-width pelo formato esperado usando as chaves padrão desktop, tablet e mobile.