Merge pull request 'feat: Inclui data tests id que faltaram' (#2) from feature/pagina-de-produto-data-test into master

Reviewed-on: #2
This commit is contained in:
Eleonora Otz de Mendonça Soares 2023-02-06 23:23:05 +00:00
commit 19af0edd26
6 changed files with 117 additions and 70 deletions

View File

@ -1,13 +1,14 @@
// Descrição // Descrição
{ {
"html#tab-layout": { "html#tab-layout": {
"props" : { "children": ["tab-layout"],
"testId": "tab-layout" "props": {
} "testId": "product-description"
}, }
},
"tab-layout": { "tab-layout": {
"children": ["tab-list", "tab-content"], "children": ["tab-list", "tab-content"],
"props": { "props": {
"blockClass": "tabLayout" "blockClass": "tabLayout"
@ -77,31 +78,31 @@
}, },
"tab-content.item#1": { "tab-content.item#1": {
"children": ["product-images#description", "rich-text#1"], "children": ["product-images#description", "product-description#1"],
"props": { "props": {
"tabId": "description#1" "tabId": "description#1"
} }
}, },
"tab-content.item#2": { "tab-content.item#2": {
"children": ["product-images#description", "rich-text#2"], "children": ["product-images#description", "product-description#2"],
"props": { "props": {
"tabId": "description#2" "tabId": "description#2"
} }
}, },
"tab-content.item#3": { "tab-content.item#3": {
"children": ["product-images#description", "rich-text#3"], "children": ["product-images#description", "product-description#3"],
"props": { "props": {
"tabId": "description#3" "tabId": "description#3"
} }
}, },
"tab-content.item#4": { "tab-content.item#4": {
"children": ["product-images#description", "rich-text#4"], "children": ["product-images#description", "product-description#4"],
"props": { "props": {
"tabId": "description#4" "tabId": "description#4"
} }
}, },
"tab-content.item#5": { "tab-content.item#5": {
"children": ["product-images#description", "rich-text#5"], "children": ["product-images#description", "product-description#5"],
"props": { "props": {
"tabId": "description#5" "tabId": "description#5"
} }
@ -122,39 +123,39 @@
} }
}, },
"rich-text#1": { "product-description#1": {
"props": { "props": {
"text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.", "text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.",
"textPosition": "CENTER", "textPosition": "CENTER",
"blockClass": "description-rich-text" "blockClass": "description-product-description"
} }
}, },
"rich-text#2": { "product-description#2": {
"props": { "props": {
"text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.", "text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.",
"textPosition": "CENTER", "textPosition": "CENTER",
"blockClass": "description-rich-text" "blockClass": "description-product-description"
} }
}, },
"rich-text#3": { "product-description#3": {
"props": { "props": {
"text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.", "text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.",
"textPosition": "CENTER", "textPosition": "CENTER",
"blockClass": "description-rich-text" "blockClass": "description-product-description"
} }
}, },
"rich-text#4": { "product-description#4": {
"props": { "props": {
"text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.", "text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.",
"textPosition": "CENTER", "textPosition": "CENTER",
"blockClass": "description-rich-text" "blockClass": "description-product-description"
} }
}, },
"rich-text#5": { "product-description#5": {
"props": { "props": {
"text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.", "text": "# Descrição do produto \n Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque. Sandália Lima Salto Bloco Baixo de amarração com palmilha levemente quadrada e aplicação de spikes na tira do cabedal. Possui variedade de cores no Prata Metalizado. Do 33 ao 40. Consulte disponibilidade de estoque.",
"textPosition": "CENTER", "textPosition": "CENTER",
"blockClass": "description-rich-text" "blockClass": "description-product-description"
} }
} }
} }

View File

@ -112,10 +112,10 @@
"rowGap": 0 "rowGap": 0
}, },
"children": [ "children": [
"flex-layout.row#product-name", "html#product-name",
"product-identifier.product", "html#product-code",
"flex-layout.row#selling-price", "html#product-price",
"product-installments", "html#product-installments",
"html#pix-price", "html#pix-price",
"html#sku-selector", "html#sku-selector",
"html#buy-button", "html#buy-button",
@ -135,6 +135,13 @@
} }
}, },
// Nome do produto
"html#product-name": {
"children": ["flex-layout.row#product-name"],
"props": { "testId": "product-name" }
},
"flex-layout.row#product-name": { "flex-layout.row#product-name": {
"props": { "props": {
"marginBottom": 3 "marginBottom": 3
@ -142,6 +149,15 @@
"children": ["vtex.store-components:product-name"] "children": ["vtex.store-components:product-name"]
}, },
// Código identificação produto
"html#product-code": {
"children": ["product-identifier.product"],
"props": {
"testId": "product-code"
}
},
// Skus // Skus
"html#sku-selector": { "html#sku-selector": {
@ -159,8 +175,24 @@
} }
}, },
// Valor do produto
"html#product-price": {
"children": ["flex-layout.row#selling-price"],
"props": {
"testId": "product-price"
}
},
// Parcelamento // Parcelamento
"html#product-installments": {
"children": ["product-installments"],
"props": {
"testId": "product-installments"
}
},
"product-installments": { "product-installments": {
"props": { "props": {
"markers": ["discount"], "markers": ["discount"],
@ -294,7 +326,8 @@
"children": [ "children": [
"product-summary-image", "product-summary-image",
"product-summary-name", "product-summary-name",
"product-price" "product-list-price",
"product-selling-price"
] ]
}, },
@ -305,6 +338,13 @@
} }
}, },
"product-list-price": {
"props": {
"message": "de {listPriceValue} por",
"blockClass": "list-price"
}
},
// Newsletter // Newsletter
"newsletter": { "newsletter": {
@ -317,7 +357,7 @@
// Informações de frete // Informações de frete
"html#shipping-simulator" : { "html#shipping-simulator": {
"props": { "props": {
"testId": "shipping-simulator" "testId": "shipping-simulator"
}, },

View File

@ -43,44 +43,40 @@
padding-right: 16px; padding-right: 16px;
} }
:global(.vtex-store-components-3-x-listPrice) { :global(.vtex-product-price-1-x-listPrice) {
display: block;
font-weight: 400; font-weight: 400;
font-size: 14px; font-size: 14px;
line-height: 19px; line-height: 19px;
color: #bababa; color: #bababa;
margin: 0; margin: 0;
padding-bottom: 8px; padding-bottom: 8px;
text-decoration: line-through;
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
:global(.vtex-store-components-3-x-listPrice) { :global(.vtex-product-price-1-x-listPrice) {
font-size: 12px; font-size: 12px;
line-height: 16px; line-height: 16px;
} }
} }
:global(.vtex-store-components-3-x-listPrice) :global(.vtex-store-components-3-x-listPriceLabel) { :global(.vtex-product-price-1-x-listPrice) :global(.vtex-product-price-1-x-listPriceValue--list-price) {
display: none; text-decoration: none;
}
:global(.vtex-store-components-3-x-listPrice) :global(.vtex-store-components-3-x-currencyContainer)::before {
content: "de ";
}
:global(.vtex-store-components-3-x-listPrice) :global(.vtex-store-components-3-x-currencyContainer)::after {
content: " por";
} }
:global(.vtex-store-components-3-x-sellingPrice) { :global(.vtex-product-price-1-x-sellingPrice) {
padding: 0; padding: 0;
} }
:global(.vtex-store-components-3-x-sellingPrice) :global(.vtex-store-components-3-x-sellingPriceLabel) { :global(.vtex-product-price-1-x-sellingPrice) :global(.vtex-product-price-1-x-sellingPriceLabel) {
display: none; display: none;
} }
:global(.vtex-store-components-3-x-sellingPrice) :global(.vtex-store-components-3-x-sellingPriceValue) { :global(.vtex-product-price-1-x-sellingPrice) :global(.vtex-product-price-1-x-sellingPriceValue) {
font-weight: 700; font-weight: 700;
font-size: 24px; font-size: 24px;
line-height: 33px; line-height: 33px;
color: #000000; color: #000000;
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
:global(.vtex-store-components-3-x-sellingPrice) :global(.vtex-store-components-3-x-sellingPriceValue) { :global(.vtex-product-price-1-x-sellingPrice) :global(.vtex-product-price-1-x-sellingPriceValue) {
font-size: 18px; font-size: 18px;
line-height: 25px; line-height: 25px;
} }

View File

@ -149,15 +149,15 @@
max-width: 100%; max-width: 100%;
display: block; display: block;
} }
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) {
max-width: 50%; max-width: 50%;
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) {
max-width: 100%; max-width: 100%;
} }
} }
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) :global(.vtex-rich-text-0-x-heading) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionTitle) {
font-weight: 400; font-weight: 400;
font-size: 24px; font-size: 24px;
line-height: 32px; line-height: 32px;
@ -165,32 +165,41 @@
margin-top: 0; margin-top: 0;
} }
@media screen and (min-width: 1920px) { @media screen and (min-width: 1920px) {
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) :global(.vtex-rich-text-0-x-heading) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionTitle) {
font-size: 32px; font-size: 32px;
line-height: 32px; line-height: 32px;
} }
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) :global(.vtex-rich-text-0-x-heading) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionTitle) {
font-size: 20px; font-size: 20px;
line-height: 32px; line-height: 32px;
} }
} }
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) :global(.vtex-rich-text-0-x-paragraph) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionText) {
font-weight: 400; font-weight: 400;
font-size: 16px; font-size: 16px;
line-height: 22px; line-height: 22px;
color: #929292; color: #929292;
} }
@media screen and (min-width: 1920px) { @media screen and (min-width: 1920px) {
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) :global(.vtex-rich-text-0-x-paragraph) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionText) {
font-size: 18px; font-size: 18px;
line-height: 25px; line-height: 25px;
} }
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-rich-text-0-x-container--description-rich-text) :global(.vtex-rich-text-0-x-paragraph) { :global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionText) {
font-size: 14px; font-size: 14px;
line-height: 19px; line-height: 19px;
} }
} }
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionText) :global(.vtex-store-components-3-x-container--description-product-description) {
padding: 0;
margin: 0;
}
@media screen and (max-width: 1024px) {
:global(.vtex-tab-layout-0-x-container) :global(.vtex-tab-layout-0-x-contentContainer) .contentItem :global(.vtex-store-components-3-x-productDescriptionContainer) :global(.vtex-store-components-3-x-productDescriptionText) :global(.vtex-store-components-3-x-container--description-product-description) {
margin-bottom: 16px;
}
}

View File

@ -45,44 +45,36 @@
// Preço sem desconto // Preço sem desconto
:global(.vtex-store-components-3-x-listPrice) { :global(.vtex-product-price-1-x-listPrice) {
display: block;
font-weight: 400; font-weight: 400;
font-size: 14px; font-size: 14px;
line-height: 19px; line-height: 19px;
color: $gray-300; color: $gray-300;
margin: 0; margin: 0;
padding-bottom: 8px; padding-bottom: 8px;
text-decoration: line-through;
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
font-size: 12px; font-size: 12px;
line-height: 16px; line-height: 16px;
} }
:global(.vtex-store-components-3-x-listPriceLabel) { :global(.vtex-product-price-1-x-listPriceValue--list-price) {
display: none; text-decoration: none;
}
:global(.vtex-store-components-3-x-currencyContainer) {
&::before {
content: "de ";
}
&::after {
content: " por";
}
} }
} }
// Preço com desconto // Preço com desconto
:global(.vtex-store-components-3-x-sellingPrice) { :global(.vtex-product-price-1-x-sellingPrice) {
padding: 0; padding: 0;
:global(.vtex-store-components-3-x-sellingPriceLabel) { :global(.vtex-product-price-1-x-sellingPriceLabel) {
display: none; display: none;
} }
:global(.vtex-store-components-3-x-sellingPriceValue) { :global(.vtex-product-price-1-x-sellingPriceValue) {
font-weight: 700; font-weight: 700;
font-size: 24px; font-size: 24px;
line-height: 33px; line-height: 33px;

View File

@ -163,7 +163,7 @@
// Conteúdo de texto da descrição do produto // Conteúdo de texto da descrição do produto
:global(.vtex-rich-text-0-x-container--description-rich-text) { :global(.vtex-store-components-3-x-productDescriptionContainer) {
max-width: 50%; max-width: 50%;
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@ -172,7 +172,7 @@
// Título da descrição do produto // Título da descrição do produto
:global(.vtex-rich-text-0-x-heading) { :global(.vtex-store-components-3-x-productDescriptionTitle) {
font-weight: 400; font-weight: 400;
font-size: 24px; font-size: 24px;
line-height: 32px; line-height: 32px;
@ -192,7 +192,7 @@
// Texto descrição do produto // Texto descrição do produto
:global(.vtex-rich-text-0-x-paragraph) { :global(.vtex-store-components-3-x-productDescriptionText) {
font-weight: 400; font-weight: 400;
font-size: 16px; font-size: 16px;
line-height: 22px; line-height: 22px;
@ -207,6 +207,15 @@
font-size: 14px; font-size: 14px;
line-height: 19px; line-height: 19px;
} }
:global(.vtex-store-components-3-x-container--description-product-description) {
padding: 0;
margin: 0;
@media screen and (max-width: 1024px) {
margin-bottom: 16px
}
}
} }
} }
} }