From 9ed2a554a72e0a065f939fe50c4cca9002b773df Mon Sep 17 00:00:00 2001
From: Shaun Hamilton <51722130+Sky020@users.noreply.github.com>
Date: Wed, 2 Sep 2020 17:59:16 +0100
Subject: [PATCH] fix(curriculum): changed test to use regex (#38770)

* changed test to use regex

* added width has to be spelt correctly

* added second width assertion

* add case insensitive flag

Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>

* fix: allow compilable CSS to pass

* add allowance of final property without semicolon

Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>
Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>
---
 .../basic-css/size-your-images.english.md                    | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/curriculum/challenges/english/01-responsive-web-design/basic-css/size-your-images.english.md b/curriculum/challenges/english/01-responsive-web-design/basic-css/size-your-images.english.md
index f8c9ca356a..f375d85e98 100644
--- a/curriculum/challenges/english/01-responsive-web-design/basic-css/size-your-images.english.md
+++ b/curriculum/challenges/english/01-responsive-web-design/basic-css/size-your-images.english.md
@@ -25,7 +25,6 @@ For example, if we wanted to create a CSS class called <code>larger-image</code>
 ## Instructions
 <section id='instructions'>
 Create a class called <code>smaller-image</code> and use it to resize the image so that it's only 100 pixels wide.
-<strong>Note:</strong> Due to browser implementation differences, you may need to be at 100% zoom to pass the tests on this challenge.
 </section>
 
 ## Tests
@@ -35,8 +34,8 @@ Create a class called <code>smaller-image</code> and use it to resize the image
 tests:
   - text: Your <code>img</code> element should have the class <code>smaller-image</code>.
     testString: assert($("img[src='https://bit.ly/fcc-relaxing-cat']").attr('class') === "smaller-image");
-  - text: Your image should be 100 pixels wide. Browser zoom should be at 100%.
-    testString: assert($("img").width() === 100);
+  - text: Your image should be 100 pixels wide.
+    testString: assert($("img").width() < 200 && code.match(/(?<=<style>([\s\S])*)\.smaller-image\s*{([\s\S]*;)?\s*width\s*:\s*100px\s*(;|})[\s\S]*(?=<\/style>)/i));
 
 ```