Taula de continguts

De les 3 modalitats d’execució que dóna CrossBrowserTesting, des del CTTI es recomana l’ús de l’opció Live Browser Testing.

Planificació

Configurar la matriu de dispositius

Durant la planificació de les proves, s’ha de definir la matriu de dispositius sobre la que es provarà.

  1. Accedir a ‘http://app.crossbrowsertesting.com/screenshots/run'

    cbt_matriu_dispositius_seleccio.png

  2. Sel·leccionar els navegadors sobre els que voldrem provar les diferents pàgines

  3. Prémer el botó ‘Save’ i escollir el nom de configuració.

Implementació

  1. Descarregar la següent aplicació: CrossBrowserTest

    I descomprimir-la en alguna carpeta local.

  2. Accedir al fitxer ‘cross_browser_test.properties’ de la carpeta descomprimida. En aquest arxiu podrem configurar:

    • LLISTA_URLS_PROVAR: Llistat d’URLs a executar en la prova separades per comes
    • USUARI_CROSS_BROWSER_TEST: Usuari de login amb llicència per a CBT
    • PASSWORD_CROSS_BROWSER_TEST: Contrasenya d’usuari de login
    • MATRIU_DISPOSITUS_NAVEGADORS: Nom de la matriu de navegadors i dispositius amb la que es vol fer la prova. Veure com es realitza a l’apartat de ‘Planificació’ anterior.
    • CHECK_URL:
      • false: si es desitja executar la prova encara que la petició a la pàgina retorni un codi diferent del 200
      • true: es considerarà una prova errònia en cas que la pàgina web no retorni un codi 200
    • DELAY_SCREENSHOT_SEGONS: Temps en segons d’espera des de que es carrega la pàgina al dispositiu, fins que es realitza la captura
    • DELAY_PROVA_SEGONS: Temps d’espera entre cada petició d’execució. Per a cada URL configurada a LLISTA_URLS_PROVAR s’envia una petició a CBT, quan una petició ha estat realitzada, l’aplicació esperarà els segons configurats en aquest paràmetre en llençar la següent prova de la llista.
    • FORMAT: Format de dades en que CBT retornarà la resposta
    • END_POINT: Url on es publiquen els serveis REST de CBT

Exemple:

    LLISTA_URLS_PROVAR= http://web.gencat.cat/ca/tramits/,\
    http://web.gencat.cat/ca/tramits/cercador/?queryNat=ajuda,\
    http://web.gencat.cat/ca/tramits/tramits-temes?tema=73e1c51e-a82c-11e3-a972-000c29052e2c,\
    http://web.gencat.cat/ca/tramits/tramits-temes?filtreResp=p,\
    http://web.gencat.cat/ca/tramits/tramits-temes?filtreResp=t,\
    http://web.gencat.cat/ca/tramits/que-cal-fer-si/,\
    http://web.gencat.cat/ca/tramits/sobre-tramits-gencat/,\
    http://web.gencat.cat/ca/tramits/tramits-temes/Certificacio-eficiencia-energetica-edificis-00002?category=748e584e-a82c-11e3-a972-000c29052e2c,\
    http://web.gencat.cat/ca/tramits/tramits-temes/Certificacio-eficiencia-energetica-edificis-00002?category=748e584e-a82c-11e3-a972-000c29052e2c&moda=1,\º
    http://web.gencat.cat/ca/tramits/que-cal-fer-si/em-jubilo/quantia-de-la-jubilacio/\

    #Configuració 
    USUARI_CROSS_BROWSER_TEST=<usuari>
    PASSWORD_CROSS_BROWSER_TEST=<password>
    MATRIU_DISPOSITUS_NAVEGADORS=<NomMatriuDispositius>
    CHECK_URL=true
    DELAY_SCREENSHOT_SEGONS=2
    DELAY_PROVA_SEGONS=30
    FORMAT=json
    END_POINT=http://crossbrowsertesting.com/api/v3/screenshots

Execució

Per executar l’aplicació cal tenir instal·lada la màquina virtual jdk1.7.0 i les variables d’entorn PATH i JAVA_HOME correctament configurades. Obrir una finestra del sistema(cmd) i executar l’aplicació amb la següent comanda:

> java –jar CrossBrowserTest.jar

Si es desitja aturar la execució, cal aturar el procés java corresponent. D’aquesta manera només s’hauran executat les proves corresponents a les URLs enviades en aquell instant

La sortida de l’aplicació és la pròpia sortida del sistema. No genera cap tipus d’arxiu de sortida.

cbt_eina_output

En iniciar el procés, l’aplicació mostra el missatge “Iniciant joc de proves”, i en finalitzar informa el total de temps emprat en iniciar les proves de totes les URLs de la llista prova.

Per cada URL definida al fitxer de configuració l’aplicació mostra:

  • URL per descarregar l’arxiu comprimit amb les captures (URL1)
  • URL per accedir a l’eina i comparar les vistes generades (URL2)
  • URL per consultar l’estat de la prova. Això és, l’aplicació inicia la prova però no espera a que acabi. L’usuari ha de consultar aquesta URL per a validar si la prova en qüestió ha finalitzat correctament. En el moment en que finalitza es poden descarregar les imatges i iniciar el comparador de vistes. En aquesta pantalla es veu quines captures estan en execució, quines han estat executades i quines s’estan executant en aquell moment:

cbt_exec_status

Avaluació

Una vegada realitzada l’execució podem avaluar les imatges generades amb dos vies:

  1. Descarregar en un arxiu comprimit en format zip totes les captures realitzades.
  2. Consultar les imatges on-line.

Descarregar arxiu comprimit

Des de la URL indicada en el procés d’execució podem descarregar els diferents zips.

Consultar les imatges on-line

Accedir a la URL generada (URL2) dins l’execució.

cbt_screenshots

Un cop executada la prova, CBT permet comparar les imatges obtingudes amb una eina que detecta les diferències de layout i les marca sobre la imatge.

Les comparacions sempre es realitzen establint un navegador de referència, en base al qual es compara la resta de resultats

cbt_screenshots_navegador_referencia

El sistema mostra un resum amb tots els navegadors amb que es pot comparar i les diferencies detectades.

cbt_screenshots_layout_differences

Quan seleccionem el navegador amb que volem comparar, el sistema mostra una llista amb les diferències detectades.

cbt_screenshots_layout_differences_2

En prémer sobre una de les diferencies detectades, l’eina mostra la diferència en pantalla

cbt_screenshots_layout_differences_2