Change assertion that element contains a specific CSS style #161

tests/features/test--then--the-element-should_not-contain-cssproperty.feature → tests/features/test--then--the-element-should-contain-cssproperty.feature

@@ -1,13 +1,9 @@
-Feature: An example to test if the element contains a certain expected CSS property or not.
+Feature: An example to test if the element contains a certain expected CSS property.
   As a developer
-  I want to be able to test if the element contains a certain expected CSS property or not.
+  I want to be able to test if the element contains a certain expected CSS property.
 
   Scenario: Check element if the element contains a certain expected CSS property
     Given I am on "/test--then--the-element-should_not-contain-cssproperty.html"
-    When I press "Submit" by attr
-    Then the "body" element should contain "background-color:white;"
-
-    Scenario: Check element if the element not contains a certain CSS property
-    Given I am on "/test--then--the-element-should_not-contain-cssproperty.html"
-    When I press "Submit" by attr
-    Then the "#uname" element should not contain "border:solid 5px red;"
+    Then I should see a "body" element by attr
+    When I press "Submit"
+    Then the "body" element should contain "background-color:white;" css style

tests/step-definitions/webship.js

@@ -638,7 +638,20 @@ Then(/^(I|we)* should not see (a|an) "([^"]*)?" element by( its)*( "([^"]*)?")*
  * Example: Then the "body" element should contain "color:white;"
  *
  */
-Then(/^the "([^"]*)?" element should contain "([^"]*)?"$/, function (element, elementCss) {
+Then(/^the "([^"]*)?" element should contain "([^"]*)?" css style$/, function (attrValue, elementCss) {
+
+  const hasASpace = attrValue.indexOf(' ');
+
+  var selector = '';
+  if((attrValue.startsWith('#') || attrValue.startsWith('.')) && hasASpace == -1){
+    selector = attrValue;
+  }
+  else if (hasASpace == -1){
+    selector = attrValue + ',#' + attrValue + ',.' + attrValue + ',[name=' + attrValue + "]," + '[value="' + attrValue + '"],[placeholder="' + attrValue + '"]';
+  }
+  else if (hasASpace > -1){
+    selector ='[value="' + attrValue + '"],[placeholder="' + attrValue + '"]';
+  }
 
   elementCss = elementCss.replace(";", '');
   const cssPropertyArr = elementCss.split(":");
@@ -647,7 +660,7 @@ Then(/^the "([^"]*)?" element should contain "([^"]*)?"$/, function (element, el
   const propertyVal = cssPropertyArr[1].trim();
 
   this.checkCss = function (browser) {
-    browser.assert.cssProperty(element, cssProperty, propertyVal);
+    browser.assert.cssProperty(selector, cssProperty, propertyVal);
   };
 });