Использование транспортира для проверки цветов ссылок

Question

Как проверить цвет ссылки на зависание с помощью транспортира?

Я хочу, чтобы имитировать мышь, зависающую по ссылке, эта ссылка меняется от белого до синего цвета, а затем я хочу, чтобы тест ожидал, что цвет = синий, при наведении.

код, который я в настоящее время использую для тестирования.

it('should redirect to the home page', function(){  
    element(by.css('ul.first_menu > li > a')); 
    expect('ul.first_menu. > li > a'.getCssValue("color")).toEqual("rgba(11, 51, 60, 1)"); 

    browser.actions().mouseMove('ul.first_menu. > li > a').perform(); 

    browser.wait(waitForCssValue('ul.first_menu. > li > a', "color", "rgba(42, 100, 150, 1)"), 1000); 
    browser.wait(waitForCssValue('ul.first_menu. > li > a', "text-decoration", "underline"), 1000); 

    waitForCssValue = function (elementFinder, cssProperty, cssValue) { 
      return function() { 
       return elementFinder.getCssValue(cssProperty).then(function(actualValue) { 
       return actualValue === cssValue; 
       }); 
      }; 
    }; 
}); 

Answer 1

Я сделал именно то, о чем вы просите.

Идея состоит в том, чтобы использовать getCssValue() и получить color и text-decoration. Затем, наведите курсор на ссылку с mouseMove() и засаде значения CSS для изменения:

var elm = element(by.css('ul.first_menu > li > a')); 
function waitForCssValue (elementFinder, cssProperty, cssValue) { 
    return function() { 
     return elementFinder.getCssValue(cssProperty).then(function(actualValue) { 
      return actualValue === cssValue; 
     }); 
    }; 
}; 

expect(elm.getCssValue("color")).toEqual("rgba(11, 51, 60, 1)"); 
expect(elm.getCssValue("text-decoration")).toEqual("none"); 

browser.actions().mouseMove(elm).perform(); 

browser.wait(waitForCssValue(elm, "color", "rgba(42, 100, 150, 1)"), 1000); 
browser.wait(waitForCssValue(elm, "text-decoration", "underline"), 1000);