- Home Page (index.html)
- Create Post (create_post.html)
- Footer (footer.html)
- Header (header.html)
- Login (login.html)
- Post (post.html)
- Profile (profile.html)
- Register (register.html)
Result: the W3C Validator for HTML does not understand the Jinja templating syntax, therefore shows repeat Errors.
See sample output below for index.html
.
Aside from the Jinja warnings and errors, all other code is valid for each of the .html pages listed above.
Result: No Errors, 6 warnings.
- File: script.js
Result: This code passed through JSHint without any errors.
I was able to leverage Bootstrap to provide most of the JavaScript functionality on this site.
However, the following code was also added to footer.html
in order to print the current year for Copyright purposes.
<script>document.write(new Date().getFullYear());</script>
Result: This code passed through JSHint without any errors.
Result: All .py files are PEP8 compliant.
-
Browser compatability: To ensure a broad range of users can successfully use this site, it was manually tested across the 6 major browsers:
- Chrome v.87
- Edge v.85
- Firefox v.81
- Safari v.12
- Opera v.71
- Internet Explorer v.6-11 (tested via BrowserStack).
-
Site responsiveness was tested using Chrome DevTools using profiles for a wide variety of devices.
-
Physical Devices tested included:
- iPhone 5 (iOS: 12.4.9)
- iPhone 6 (iOS: 12.4.9)
- Samsung Galaxy A10 (Model SM-A105FN, Build/QP1A, on Android 10)
- MacBook Pro (Retina, 13", Late 2013, OS Catalina)
- Apple iMac 27" (also running Windows 10 Pro ver. 2004, OS 19041.630)
Result: Both browser compatability and site responsiveness testing can be summarised in the table below. Responsiveness was good on all of the devices listed, both physical and simulated. Brower compatability was good across all the major browsers, except for Internet Explorer 6-11.
I created a comprehensive Testing Document to assess site functionality, usability and data management which can be viewed as a PDF here.
Overview of Testing Procedure:
- Testing Account Creation and Log in.
- Testing Create, Read, Update, Delete of Blog Posts.
- Testing Create, Read, Delete of Blog Post Comments.
- Testing 404, 403, 500 Errors.
- Testing URL Protection.
- Testing Search Functionality.
Result: Site performed as expected. Please see the Testing Document referenced above.
Automated testing was performed using Chrome Dev Tools - Lighthouse. Lighthouse is an open-source, automated tool for improving the quality of web pages. It performs audits under the following headers:
- Performance
- Accessibility
- Best Practices
- SEO
Result: see summary results below for Desktop index.html.
- For Best Practices x5 insecure requests were found as the site does not use HTTPs. As that is not within the remit of this project, these warnings were ignored.
Result: The majority of user stories have been successfully implemented, with a ✅ to denote items that have been implemented. User stories related to an adminstrator account have been pushed into a later sprint.
"As a non-registered user, I ______________________________________________"
- ✅ should be presented with blog article on the main page.
- ✅ should be able to click on an article on the main page to read more about it.
- ✅ should be able to search through articles.
- ✅ should be able to register an account with the site in order to publish articles, and comment on them.
"As a registered user, I ______________________________________________"
- ✅ should be able to login to the site in order to publish articles.
- ✅ should be presented with a profile page showing all of my posts.
- ✅ should be able to update and delete posts from my profile page.
- ✅ should be able to create comments on any other posts.
- ✅ should be able to delete comments that I have made.
- ✅ should be able to logout of my account.
- This bug was noticed in the console was navigating to a page that had a CKEditor Form element.
- It is worth noting that the CKEditor form works fine, and is fully operational, despite the error.
- One suggestion from the CKEditor docs was to check if the passed argument points to the correct element. I confirmed that it was, and also tried renaming the variable.
- Another suggested solution from stackoverflow
was to create a dummy
textarea
element and then initialize the editor after the declaration of thetextarea
element. - This bug has not impacted functionality, but investigations are still ongoing to find a resolution.