Как получить все CSS-стили из DOM-элемента с помощью Selenium, C#

Question

Моя задача - создать свернутый css-файл с веб-страницы. И поэтому мне нужны значения из всех css-свойств из всех dom-элементов. Но я не знаю: как получить все вычисленные css-стили от определенного dom-элемента?

У меня есть следующий код:

var chromeOptions = new ChromeOptions();
chromeOptions.AddArguments("headless");

var browser = new ChromeDriver(chromeOptions);

var url = "https://example.com";
browser.Navigate().GoToUrl(url);

var domElement = browser.FindElement(By.TagName("html"));

И я хочу:

var styles = domElement.GetComputedCssStyles();

Answer 1

Ты можешь использовать getCSSValue метод IWebElement, Например, чтобы получить цвет фона элемента, вы можете попробовать следующий код.

var chromeOptions = new ChromeOptions();
chromeOptions.AddArguments("headless");

var browser = new ChromeDriver(chromeOptions);

var url = "https://example.com";
browser.Navigate().GoToUrl(url);

var domElement = browser.FindElement(By.TagName("html"));
var color = domElement.GetCssValue("background-color");

Можете ли вы попробовать следующий код JavaScript, используя селен C#;

string properties = ((IJavaScriptExecutor)driver).ExecuteScript("return window.getComputedStyle(arguments[0],null).cssText", domElement);
strArr = properties.split(";")

for (count = 0; count <= strArr.Length - 1; count++)
{
    console.log(strArr[count]);
}

Answer 2

Чтобы получить все вычисленные css-стили из определенного dom-элемента, вы можете использовать следующую строку кода:

• C#:

  ((IJavaScriptExecutor)driver).ExecuteScript("var items = {}; for (index = 0; index < arguments[0].attributes.length; ++index) { items[arguments[0].attributes[index].name] = arguments[0].attributes[index].value }; return items;", myElem);
  

• Пример (Java) блок кода:

  WebDriver driver = new FirefoxDriver();
  driver.get("https://www.google.com/");
  WebElement myElem = driver.findElement(By.name("q"));
  System.out.println(((JavascriptExecutor)driver).executeScript("var items = {}; for (index = 0; index < arguments[0].attributes.length; ++index) { items[arguments[0].attributes[index].name] = arguments[0].attributes[index].value }; return items;", myElem).toString());
  

• Консольный вывод:

  {aria-autocomplete=list, aria-haspopup=false, aria-label=Search, autocomplete=off, class=gsfi lst-d-f, dir=ltr, id=lst-ib, maxlength=2048, name=q, role=combobox, spellcheck=false, style=border: medium none; padding: 0px; margin: 0px; height: auto; width: 100%; background: transparent url("data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw%3D%3D") repeat scroll 0% 0%; position: absolute; z-index: 6; left: 0px; outline: medium none currentcolor;, title=Search, type=text, value=}