Как добавить и выполнить html2canvas на веб-странице с Watir

1

Как я могу добавить html2canvas на данную веб-страницу, выполнить ее, а затем прочитать ее результаты с помощью Watir?

require 'watir'

b = Watir::Browser.new :firefox
b.goto "google.com"

path = "/path/to/html2canvas.js" # v. 0.5.0-alpha1
h2c_payload = File.read(path)
b.execute_script h2c_payload

h2c_activator = %<
  function genScreenshot () {
    var canvasImgContentDecoded;
    html2canvas(document.body, {
      onrendered: function (canvas) {
       window.canvasImgContentDecoded = canvas.toDataURL("image/png");
    }});
  };
  genScreenshot();
>.gsub(/\s+/, ' ').strip
b.execute_script h2c_activator

b.execute_script "return window.canvasImgContentDecoded"
 => nil

Выполнение того же JavaScript в консоли приводит к тому, что переменная (в конечном счете) устанавливается, а затем возвращается при вызове. В чем отличие execute_script?

  • 1
    Есть ли причина, по которой вы используете v0.5.0-alpha1, а не последнюю v1.0.0-alpha.9?
  • 0
    @JustinKo только потому, что я нашел пример с этой версией, и ни одна из версий, похоже, не является версией GM. Я постараюсь изменить версию завтра.
Показать ещё 1 комментарий
Теги:
selenium-webdriver
watir

1 ответ

1

Проблема заключается в том, что canvasImgContentDecoded проверяется до того, как будет завершена обработка холста. Не будучи программистом на JavaScript, мне легче выполнять ожидание в Ruby/Watir:

result = nil
b.wait_until { result = b.execute_script "return window.canvasImgContentDecoded;" }
p result
#=> "data:image/png;base64,iVBORw0KGgoA..."

Вышеупомянутое устраняет проблему только при использовании Chrome.

У Firefox, похоже, есть другие ограничения и/или ограничения, которые препятствуют работе исходного кода. Следующее работало в Firefox и в Chrome. Обратите внимание, что для этого может потребоваться более новая версия html2canvas:

require 'watir'

b = Watir::Browser.new :firefox
b.goto("google.com")

# Load html2canvas - currently  v1.0.0-alpha.9
h2c_payload = %<
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src =  'https://html2canvas.hertzen.com/dist/html2canvas.js';
  document.head.appendChild(script);
>.gsub(/\s+/, ' ').strip
b.execute_script(h2c_payload)

# Wait for html2canvas to load
b.wait_while { b.execute_script("return typeof html2canvas === 'undefined'") }

# Generate the canvas
h2c_activator = 'html2canvas(document.body).then(canvas => {window.canvasImgContentDecoded = canvas.toDataURL("image/png");});'
b.execute_script h2c_activator

# Wait for canvas to be created
result = nil
b.wait_until { result = b.execute_script "return window.canvasImgContentDecoded;" }
p result
#=> "data:image/png;base64,iVBORw0KGgoA..."
  • 0
    Я получаю только Watir::Wait::TimeoutError: timed out after 30 seconds, waiting for true condition on #<Watir::Browser:0x..f8ac5dc61862c6c6e url="https://www.google.com/?gws_rd=ssl" title="Google"> . В консоли изображение генерируется за считанные секунды, если не быстрее.
  • 0
    Ох, интересно. Код работает при использовании Chrome, но не Firefox. Это хлопотно

Ещё вопросы

Сообщество Overcoder
Наверх
Меню