mobify / stencil

DEPRECIATED - The latest Stencil development is currently taking place in the Adaptive.js repo.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Align Component - Needs device testing

avelinet opened this issue · comments

Needs manual checking of its tests on:

  • iOS 8.0.2
  • iOS 7
  • iOS 6
  • iOS 5
  • Android 4.x Chrome (latest)
  • Android 4.4 Browser
  • Android 4.2 or 4.3 Browser
  • Android 4.1 Browser
  • Android 4.0 Browser
  • Android 2.3 Browser

Manual testing instructions

  1. Ensure you have Sass 3.3+: sass -v # Sass 3.3.x or above

If you have Sass < 3.3, run gem update sass
2. Ensure you have Bower: bower -v # e.g. 1.3.5

If not, run npm install -g bower
3. Clone git@github.com:mobify/stencil.git. Tests should be done on master.
4. Change to the stencil directory and run npm install && bower install
5. Run grunt to compile the test stylesheets
6. Run python -m SimpleHTTPServer to make the visual tests available on localhost:8000
7. Change to stencil/tests/visual/
8. For each browser listed in the original post above:

  1. Navigate to http://{your.local.ip.address}:8000. You should see the Stencil directory listing.
  2. Navigate to tests/visual/. You should see two directories: components/ and utils/.
  3. For each component and util:
    1. Navigate to the component or util’s test path, e.g. ./components/align/
    2. The test file contains a set of test cases, each of which starts with an assertion of the form “It should…” that describes an aspect of how that style should render. Check that the browser’s rendering matches the description. You can compare the result with desktop Chrome’s rendering by pointing Chrome at http://localhost:8000. There should be no major discrepancies.
    3. If the browser doesn’t seem to render a test case correctly, take a screenshot and make a note of the issue.
    4. When done checking the test file, if there are problems, open a ticket on the GitHub repo at https://github.com/mobify/stencil/issues. Use the title format “{Name} {type} – visual issues in {browser}”, e.g. “Align component – visual issues in iOS 5” or “Layout utils – visual issues in Andoid 4.1”.
    5. In the issue body, describe the problems and attach screenshots.
    6. Tag the issue with “device-testing”.
  4. If the above has been done for each component and util in every browser, you’re done!

device testing complete