2016-05-02 2 views
0

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

A tool to compare element properties on different pages

+0

Hello. Добро пожаловать в Stack Overflow. Пожалуйста, оглянитесь и возьмите [тур] и прочитайте [справочный центр]. Вы также можете прочитать о [спросите] хороший вопрос. – Sampada

+0

Вы хотите сравнить CSS, применяемые к вашему сайту, в разработке или вычисленных значениях на страницах в процессе производства/«на лету»? Бывший: вы можете написать плагин с API [PostCSS] (https://github.com/postcss/postcss), который будет содержать соответствующие правила (тогда вы можете отсортировать их и сравнить). Последнее: вам придется получать вычисленные значения на обеих страницах и сравнивать их (я не знаю ни одного скрипта для этого) – FelipeAls

+0

Не то, что вы ищете, но все же полезно: [Firediff] (http://getfirebug.com) /wiki/index.php/Firebug_Extensions#Firediff) покажет вам, что удаляется и добавляется на страницу.Инструмент визуальной регрессии (который также может сравнивать 2 элемента на двух разных страницах вместо 2 моментов времени) - [PhantonCSS] (https://github.com/Huddle/PhantomCSS) – FelipeAls

ответ

0

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

Что такое HTML-хранилище?

С локальным хранилищем веб-приложения могут хранить данные локально в браузере пользователя.

Перед HTML5 данные приложения должны храниться в файлах cookie, включенных в каждый запрос сервера. Локальное хранилище более безопасно, и большие объемы данных могут храниться локально, не влияя на производительность веб-сайта.

http://www.w3schools.com/html/html5_webstorage.asp

1

2 категории тестов, которые должны решить эту проблему, вы встречая являются Computed Style и Frozen DOM методы по csste.st.

Csste.st ссылается на все проекты, применяя эти методы, но будьте осторожны, что этот сайт не обновлялся за последние 2 года. Большинство инструментов все еще вокруг, и с тех пор было создано немного, но все же - новых.

Компьютерная техника Стиль:

С помощью этого метода, тестовый блок содержит селектор CSS, необходимый для доступа к элементу проверяемого и список стилей, которые должны быть применены к элементу. В отличие от Frozen DOM, этот метод не сохраняет локальную копию проекта DOM. Это означает, что он может быть более надежным.

Замороженный DOM техника:

С Замороженный DOM тесты, идея заключается в том, чтобы сделать снимок DOM структуры страницы, которую вы хотите протестировать и стили, которые в настоящее время применяются к тем, DOM. Вы также записываете селектор CSS элемента, чтобы тест мог его найти. Когда вы вносите изменения в свой CSS, вы применяете новую таблицу стилей к (старой) Frozen DOM. Если стили, применяемые к элементу через каскад, являются измерениями, измеренными ранее и ожидаемыми, он считается пропуском. Если нет, это провал.

Смежные вопросы