diff --git a/changedetectionio/content_fetcher.py b/changedetectionio/content_fetcher.py index d7d657bd..c6535937 100644 --- a/changedetectionio/content_fetcher.py +++ b/changedetectionio/content_fetcher.py @@ -236,8 +236,9 @@ class base_html_playwright(Fetcher): proxy=self.proxy ) page = context.new_page() - page.set_viewport_size({"width": 1280, "height": 1024}) response = page.goto(url, timeout=timeout * 1000) + # set size after visiting page, otherwise it wont work (seems to default to 800x) + page.set_viewport_size({"width": 1280, "height": 1024}) extra_wait = int(os.getenv("WEBDRIVER_DELAY_BEFORE_CONTENT_READY", 5)) page.wait_for_timeout(extra_wait * 1000) @@ -258,7 +259,7 @@ class base_html_playwright(Fetcher): # Some bug where it gives the wrong screenshot size, but making a request with the clip set first seems to solve it # JPEG is better here because the screenshots can be very very large page.screenshot(type='jpeg', clip={'x': 1.0, 'y': 1.0, 'width': 1280, 'height': 1024}) - self.screenshot = page.screenshot(type='jpeg', full_page=True, quality=90) + self.screenshot = page.screenshot(type='jpeg', full_page=True, quality=92) context.close() browser.close() diff --git a/changedetectionio/static/js/visual-selector.js b/changedetectionio/static/js/visual-selector.js index c314dc8f..6ad31f42 100644 --- a/changedetectionio/static/js/visual-selector.js +++ b/changedetectionio/static/js/visual-selector.js @@ -27,6 +27,7 @@ function fetch_data() { }).done(function (data) { $('.fetching-update-notice').html("Rendering.."); selector_data = data; + set_scale(); reflow_selector(); $('.fetching-update-notice').fadeOut(); }); @@ -42,14 +43,17 @@ $(window).resize(function() { set_scale(); }); - $('#visualselector-tab').bind('click', function (e) { set_scale(); reflow_selector(); }); + function set_scale() { + + // some things to check if the scaling doesnt work + // - that the widths/sizes really are about the actual screen size cat elements.json |grep -o width......|sort|uniq selector_image_rect = selector_image.getBoundingClientRect(); // make the canvas the same size as the image $('#selector-canvas').attr('height', selector_image_rect.height); @@ -59,10 +63,6 @@ function set_scale() { ctx.strokeStyle = 'rgb(255,0,0, 0.8)'; ctx.lineWidth = 2; - vh = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0); - - $("#selector-wrapper").css('height', vh-250); - $("#selector-current-xpath").css('max-width', selector_image_rect.width); }