Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Vista de detalle producto

Aperta
  • Qualcosa non va?
#6 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
38/100
Tipo di issue
Funzionalità
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
javascript
Ambito
frontend, testing-qa

Direzione di ricerca

Inizia individuando la vista del prodotto nel frontend, i relativi fixtures, i test end-to-end esistenti e lo store Vuex utilizzato per i prodotti. Segui quindi la navigazione ai dettagli del prodotto e il flusso di caricamento dei componenti, poi esamina gli scenari di accettazione indicati. Il lavoro è completato quando la route e la vista dei dettagli funzionano, l’assenza di dati nello store reindirizza alla pagina dei prodotti, i fixtures includono i prezzi e i test richiesti coprono questi comportamenti.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

enhancement get certificate required

Criterios de Aceptación

Característica: Detalle de producto
  Existe una página de detalle de producto donde se puede ver la información. Para acceder a esta página debemos hacer click sobre un botón 

  Escenario: Vista detalle producto
    Dado el usuario autenticado en la página principal
    Cuando el usuario hace click sobre el botón "ver detalle" de un producto
    Luego el usuario va hacia la página de detalle del producto seleccionado
    Y se muestra la información completa del producto
    
 Escenario: Recarga de la vista de producto
    Dado el usuario autenticado en la página de detalle de un producto
    Cuando el usuario recarga la página de detalle de producto
    Luego el usuario es re dirigido a la página de productos

Requerimientos técnicos

  • Crear una prueba e2e que compruebe que al hacer click en el botón detalle de producto el usuario es dirigido a la página correspondiente

Tip: puedes utilizar un atributo data-cy para almacenar el id del producto y así correlacionarlo de mejor manera con los fixtures y hacer una aserción más efectiva. No olvides modificar los fixtures para incluir el precio en cada item.

  • Modificar el código Frontend para mostrar el boton de detalle de producto y luego crear una nueva vista con su propia ruta de acceso como muestran las siguientes imágenes:


  • Crear una lógica que valide que si al cargarse el componente de detalle de producto, los productos guardados en el store Vuex están. En caso contrario redirigir a la página de productos.
  • Crear una prueba de Frontend para el componente de detalle de producto que valide la lógica anterior, es decir, que al cargarse el componente se redirige hacie la vista de productos en función de si existe o no la lista de productos en el store.

Notas
Se espera que al menos 1 de los criterios de aceptación esté automatizado

Lingua principale
JavaScript
Stelle
0
Fork
6
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di booleancl/G01-2021-fullstack-javascript-final

Tutte le issue di booleancl/G01-2021-fullstack-javascript-final

Issue simili

Altre issue su JavaScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.