TESTING.md

Testing

Note

Return back to the README.md file.

Code Validation

HTML

I have used the recommended HTML W3C Validator to validate all of my HTML files.

Directory	File	Screenshot	Notes
bag	bag.html
checkout	checkout.html
checkout	checkout_success.html
home	index.html
products	add_products.html
products	edit_products.html
products	product_detail.html
products	products.html
user profile	profile.html

CSS

I have used the recommended CSS Jigsaw Validator to validate all of my CSS files.

Directory	File	Screenshot	Notes
checkout	checkout.css
profiles	profile.css
static	style.css

JavaScript

I have used the recommended JShint Validator to validate all of my JS files.

Directory	File	Screenshot	Notes
checkout	stripe_elements.js
profiles	countryfield.js
static	main.js		The errors shown in this screenshot are related to the Bootstrap Tooltip JavaScript. For reference, I've included the official documentation here: Bootstrap Tooltip Documentation.

Python

I have used the recommended PEP8 CI Python Linter to validate all of my Python files.

Directory	File	CI URL	Screenshot	Notes
bag	admin.py	PEP8 CI
bag	contexts.py	PEP8 CI
bag	models.py	PEP8 CI
bag	bag_tools.py	PEP8 CI
bag	urls.py	PEP8 CI
bag	views.py	PEP8 CI
checkout	admin.py	PEP8 CI
checkout	forms.py	PEP8 CI
checkout	models.py	PEP8 CI
checkout	signals.py	PEP8 CI
checkout	urls.py	PEP8 CI
checkout	views.py	PEP8 CI
checkout	webhook_handler.py	PEP8 CI
checkout	webhooks.py	PEP8 CI
home	admin.py	PEP8 CI
home	models.py	PEP8 CI
home	urls.py	PEP8 CI
home	views.py	PEP8 CI
project	manage.py	PEP8 CI
products	admin.py	PEP8 CI
products	contexts.py	PEP8 CI
products	forms.py	PEP8 CI
products	models.py	PEP8 CI
products	urls.py	PEP8 CI
products	views.py	PEP8 CI
profiles	admin.py	PEP8 CI
profiles	forms.py	PEP8 CI
profiles	models.py	PEP8 CI
profiles	urls.py	PEP8 CI
profiles	views.py	PEP8 CI
shoply	cvs_to_json.py	PEP8 CI
shoply	dataset_processor.py	PEP8 CI
shoply	kaggle_api_handler.py	PEP8 CI
shoply	settings.py	PEP8 CI
shoply	urls.py	PEP8 CI
user_activity	admin.py	PEP8 CI
user_activity	models.py	PEP8 CI
user_activity	views.py	PEP8 CI

Browser Compatibility

Cross-browser testing is important to make sure your website works well on different browsers, like Chrome, Firefox, Safari, and Edge. Since each browser can show things a little differently, testing helps catch any problems with how your site looks or works.

I've tested my deployed project on multiple browsers to check for compatibility issues.

Browser	Home	Product	Product Details	Checkout	Notes
Chrome					Works as expected
Edge					Works as expected
Firefox					Works as expected

Responsiveness

I've tested my deployed project on multiple devices to check for responsiveness issues.

Device	Home	Product	Details	Checkout	Notes
Mobile (DevTools)					Works as expected
Tablet (DevTools)					Works as expected
Desktop					Works as expected

Lighthouse Audit

I've tested my deployed project using the Lighthouse Audit tool to check for any major issues.

After reviewing my Google Lighthouse results, I can see there’s room for improvement in a few areas. My mobile performance score of 60 is lower than I’d like, so I plan to optimize loading speeds and reduce file sizes. I’m happy with the accessibility score of 85+, but I know I could improve it further by refining color contrast and ARIA roles. The best practices score of 75 shows there are some security and optimization issues to address, and while my SEO score of 100 is great, I’ll need to keep an eye on that. On desktop, performance at 70+ still needs some attention, and best practices (74) could be improved too. I’ll focus on improving these areas while keeping my accessibility and SEO scores strong.

Page	Mobile	Desktop	Notes
Home			Mobile performance needs improvement, while accessibility, best practices, and SEO can be fine-tuned over time.
Product			Some minor warnings, mostly image loading times
Checkout			Slow response time due to image rendering

Defensive Programming

Defensive programming was manually tested with the below user acceptance testing:

Location	Expectation	Test	Result	Fix	Screenshot
User
	The delivery form currently allows users to input any type of data.	Tested the feature by inputting characters, symbols, and numbers	The feature performed as expected, allowing me to save any input, including characters, symbols, and numbers, without restriction	Test concluded and failed. In future, I need to include form sanitisation.
	Feature is expected to reject all unspecified formats and strings	Tested the feature by inputting wrong information	The feature did responded as expected, but the level of specificity could be improved for greater protection	Test concluded and passed, with notes
	The site is expected to reject all users if cookies are missing	Tested the feature by deleting cookies	The feature did respond as expected	Test concluded and passed
Products
	The quantity buttons are expected to prevent submitting values outside of a given range	Tested the feature by using a scroll, refreshin the page while holding keys, inputing characters and numbers.	The feature behaved as expected, and prevent submitting outside it's limits	Test concluded and passed
	The model scheme is expected to stop admins entering non-valid entries	I tested this by entering different information into the fields	The numerical input in the "stars" field was further constrained by a range, preventing values outside the specified limits from being submitted. This was enforced by the Validator rules, ensuring that only valid input within the defined range could be entered.	The feature responded as expected, but features like these should be implemented across all the models.
Navigation
	Can I brute force user accounts ?	Tested the by inputting various terms into the URL: test accounts, 'user', 'account', ect...	Django and allauth worked as expected	Test concluded and passed

User Story Testing

User Story	Screenshot
As a shopper, I would like to view a list of products, so that I can select some to purchase.
As a shopper, I would like to view specific categories, so that I can find something quickly.
As a shopper, I would like to select out a product, so that I focus on the product itself.
As a new site user, I would like to easily login, so that I can access my information quickly.
As a new site user, I would like to easily register, so that I can view my personal profile.
As a new site user, I would like to recieve email confirmation, so that I can verify my purchase.
As a returning site user, I would like to have my orders saved, so that I can review my purchases.
As a returning site user, I would like to quick access to products I've seen before, so that I don't have to write anything down.
As a returning site user, I would like to quickly see the most popular items, so that I can find some quick christmas gifts.
As a site administrator, I should be able to modify profiles, so that I can maintain site security.
As a site administrator, I should be able to see all products, so that I can check site inventory.
As a site administrator, I should be able to see change products, so that I can update site inventory.

Automated Testing

I fully acknowledge that automated testing would be an essential part of a comprehensive testing strategy in a real-world scenario. In this case, my testing approach has been more manual, focusing on key aspects of browser compatibility and user experience.

Bugs

• The HTML validator will show an error with the body tags if another tag is missing.

  

  • To fix this, I replacing the missing tag.

• Python E501 line too long (93 > 79 characters)

  

  • To fix this by re-oganising onto different lines or shortening phrasing.

Unfixed Bugs

• There are two bugs in the JSHint linter that can’t be fixed because they’re tied to how Bootstrap is structured internally. These issues come from the code used to enable Popper.js tooltips, and fixing them would go beyond the scope of this project. For now, they’ve been noted and left to be addressed later.

  

• There was a warning in the HTML validator about a possible misuse of the aria-label, but after checking, everything seemed fine. Fixing this would require reaching out to the W3C team, and since it’s just a warning and doesn’t appear to be an issue with my code, I decided to leave it for now.

  

Note

There are no remaining bugs that I am aware of.