Skip to content

Validation tasks

Simmo Saan edited this page Mar 26, 2017 · 19 revisions

(X)HTML kehtivus

Verified (X)HTML validity for every single navigable page using the browser plugin for Firefox.

CSS kehtivus

A fork of Bootstrap 3.3.7 was created where all CSS validation errors were fixed: https://github.com/sim642/bootstrap/tree/v3.3.7-valid. Changes were made in Less source files, compiled to CSS, minified and imported back into our project.

Kujundus, sisu ja loogika on eraldatud

All CSS style elements are in separate files(see /src/main/resources/static/css/). No inline CSS is present in HTML templates.

Inlined JavaScript is used in user, post, settings, feed and statistics templates. It's sole function is to make the data put to the view available for the static JS script.

WCAG 2.0 standard

AChecker false positives:

  1. On user profile page, e.g. /users/1 (template user.html):

    Check 37: Header nesting - header following h1 is incorrect.

    Line 128, Column 21:

    <h1>Veiko Kääp</h1>

    The header following h1 is h4 inside the post location map's modal window:

    <h4 class="modal-title">Post location</h4>

    The h4 is in a completely different place in the document (h1 in the beginning, h4 at the end) and also not visible by default, only when a post's location is viewed (which hides the rest of the page). For these reasons the headings do not actually belong together and thus one shouldn't be the subheading of another as the validator requires.

  2. On settings page, i.e. /settings (template settings.html):

    Check 204: input element, type of "radio", has no text in label. Check 188: Label text is empty.

    Line 170, Column 37:

    <input id="EN" value="EN" type="radio" name="language" checked="checked">

    Line 173, Column 37:

    <input id="EE" value="EE" type="radio" name="language">

    The actual surrounding code is:

    <label class="btn btn-default active">
       <input id="EN" value="EN" type="radio" name="language" checked="checked">
       <span>English</span>
    </label>
    <label class="btn btn-default">
       <input id="EE" value="EE" type="radio" name="language">
       <span>Eesti</span>
    </label>

    Check 204 help text allows as one option:

    1. The input element is contained by a label element.
    2. Check if the label contains text.

    Thus the actual code is valid but the validator fails to see the surrounding label and the text within it.

Brauseri tugi

  • Desktop
    • Chrome 56.0
    • IE 11.0
    • Chrome 55.0
    • Firefox 51
    • Chrome 45.0
    • Edge 14
    • Firefox 52
  • Mobile
    • Chrome 52.0
    • Safari 10.0
    • Chrome 56.0
    • Android Browser 4.0
    • Safari 602
    • Chrome 44.0
    • Firefox 51

Ticked elements are ones which are manually tested. Rest were tested using http://browsershots.org/

Aknasuuruste tugi

  • 1366x768
  • 1024x768
  • 1280x800
  • 768x1024
  • 1280x1024
  • 1920x1080
  • 1440x900
  • 320x480

Heade praktikate järgimine

Veebilehitseja edasi-tagasi nuppude tugi (ka Javascriptiga uuendatud lehtede korral)

Paroole ei tohi olla koodihoidlas

Production environment password/certificate elements are not publicly available.

External properties file which contains the secret elements is only available in the production server which is attached to the application upon startup using Spring.

SQL päringud on parametriseeritud

Query parametrization is also handled by Spring Repositories.

XSS tõrje

Thymeleaf in conjunction with Spring escapes the user input in order to prevent XSS.

This can be verified by simply putting the following into a feed post and checking the source of the page after posting.

<script>alert("No XSS?");</script>

Rakendus ei teosta INSERT ega UPDATE päringuid (protseduuride kasutamine andmete muutmiseks)

No INSERT or UPDATE queries are done in the project. This functionality is achieved by the usage of Spring Repositories.

Rakendus ei teosta SELECT päringuid mittekonstantsetel tabelitel (vaadete kasutamine andmete pärimiseks)

POST, GET, PUT, HEAD jt. käskude korrektne kasutamine

HTTP method usage is restricted by Spring's annotations(GetMapping, PostMapping, PutMapping, DeleteMapping). All other request methods will result in a 405 Method Not Allowed HTTP error.

URI-de korrektne kasutamine

Application does follow the RESTful principals. See restful branch for development and ee.potatonet.controller package for HTTP endpoint mappings.

Põhifunktsionaalsus töötab ka Javascriptita wtf, No Javascript in 2017?

Most of the functionality can be used without JavaScript.

Suhtühikute kasutamine absoluutsete asemel

Aknalaiusega arvestav CSS (veebilehe sisu ümber paigutamine veebilehitseja akna laiust arvestdes)

Koodi dokumenteerimine