From 12e91751c3f03e689cdee10ee771c32395814138 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elena=20Torr=C3=B3?= Date: Tue, 14 Oct 2025 17:29:04 +0200 Subject: [PATCH] :wrench: Improve debugging UI (#7500) --- render-wasm/src/render.rs | 68 ++++++++++---- render-wasm/src/render/debug.rs | 156 ++++++++++++-------------------- 2 files changed, 107 insertions(+), 117 deletions(-) diff --git a/render-wasm/src/render.rs b/render-wasm/src/render.rs index 94e66ba0b0..37c04900f3 100644 --- a/render-wasm/src/render.rs +++ b/render-wasm/src/render.rs @@ -422,15 +422,6 @@ impl RenderState { rect, self.background_color, ); - - if self.options.is_debug_visible() { - debug::render_workspace_current_tile( - self, - "".to_string(), - self.current_tile.unwrap(), - rect, - ); - } } pub fn apply_drawing_to_render_canvas(&mut self, shape: Option<&Shape>) { @@ -814,6 +805,12 @@ impl RenderState { // bools::debug_render_bool_paths(self, shape, shapes, modifiers, structure); } }; + + if self.options.is_debug_visible() { + let shape_selrect_bounds = self.get_shape_selrect_bounds(&shape); + let shape_extrect_bounds = self.get_shape_extrect_bounds(&shape, shapes, modifiers); + debug::render_debug_shape(self, shape_selrect_bounds, shape_extrect_bounds); + } if apply_to_current_surface { self.apply_drawing_to_render_canvas(Some(&shape)); } @@ -871,6 +868,10 @@ impl RenderState { canvas.draw_image(snapshot, (0, 0), Some(&skia::Paint::default())); canvas.restore(); + if self.options.is_debug_visible() { + debug::render(self); + } + ui::render(self, shapes, modifiers, structure); debug::render_wasm_label(self); @@ -913,7 +914,8 @@ impl RenderState { ); } - debug::render_debug_tiles_for_viewbox(self); + // FIXME - review debug + // debug::render_debug_tiles_for_viewbox(self); performance::begin_measure!("tile_cache"); self.pending_tiles.update(&self.tile_viewbox); @@ -1103,6 +1105,33 @@ impl RenderState { ) } + pub fn get_rect_bounds(&mut self, rect: skia::Rect) -> Rect { + let scale = self.get_scale(); + let offset_x = self.viewbox.area.left * scale; + let offset_y = self.viewbox.area.top * scale; + Rect::from_xywh( + (rect.left * scale) - offset_x, + (rect.top * scale) - offset_y, + rect.width() * scale, + rect.height() * scale, + ) + } + + pub fn get_shape_selrect_bounds(&mut self, shape: &Shape) -> Rect { + let rect = shape.selrect(); + self.get_rect_bounds(rect) + } + + pub fn get_shape_extrect_bounds( + &mut self, + shape: &Shape, + tree: &ShapesPool, + modifiers: &HashMap, + ) -> Rect { + let rect = shape.extrect(tree, modifiers); + self.get_rect_bounds(rect) + } + pub fn get_aligned_tile_bounds(&mut self, tile: tiles::Tile) -> Rect { let scale = self.get_scale(); let start_tile_x = @@ -1265,16 +1294,6 @@ impl RenderState { modifiers, ); - if self.options.is_debug_visible() { - debug::render_debug_shape( - self, - &transformed_element, - is_visible, - tree, - modifiers, - ); - } - if !is_visible { continue; } @@ -1545,6 +1564,15 @@ impl RenderState { let tile_rect = self.get_current_tile_bounds(); if !is_empty { self.apply_render_to_final_canvas(tile_rect); + + if self.options.is_debug_visible() { + debug::render_workspace_current_tile( + self, + "".to_string(), + current_tile, + tile_rect, + ); + } } else { self.surfaces.apply_mut(SurfaceId::Target as u32, |s| { let mut paint = skia::Paint::default(); diff --git a/render-wasm/src/render/debug.rs b/render-wasm/src/render/debug.rs index fee17a2906..4425335854 100644 --- a/render-wasm/src/render/debug.rs +++ b/render-wasm/src/render/debug.rs @@ -1,13 +1,5 @@ -use crate::shapes::Shape; -use crate::state::ShapesPool; -use crate::uuid::Uuid; - -use crate::math::Matrix; -use skia_safe::{self as skia, Rect}; - -use std::collections::HashMap; - use super::{tiles, RenderState, SurfaceId}; +use skia_safe::{self as skia, Rect}; #[cfg(target_arch = "wasm32")] use crate::run_script; @@ -23,10 +15,11 @@ fn get_debug_rect(rect: Rect) -> Rect { ) } +#[allow(dead_code)] fn render_debug_view(render_state: &mut RenderState) { let mut paint = skia::Paint::default(); paint.set_style(skia::PaintStyle::Stroke); - paint.set_color(skia::Color::from_rgb(255, 0, 255)); + paint.set_color(skia::Color::GREEN); paint.set_stroke_width(1.); let rect = get_debug_rect(render_state.viewbox.area); @@ -36,6 +29,7 @@ fn render_debug_view(render_state: &mut RenderState) { .draw_rect(rect, &paint); } +#[allow(dead_code)] pub fn render_debug_cache_surface(render_state: &mut RenderState) { let canvas = render_state.surfaces.canvas(SurfaceId::Debug); canvas.save(); @@ -50,7 +44,7 @@ pub fn render_wasm_label(render_state: &mut RenderState) { let canvas = render_state.surfaces.canvas(SurfaceId::Target); let skia::ISize { width, height } = canvas.base_layer_size(); let mut paint = skia::Paint::default(); - paint.set_color(skia::Color::from_argb(100, 0, 0, 0)); + paint.set_color(skia::Color::GRAY); let str = if render_state.options.is_debug_visible() { "WASM RENDERER (DEBUG)" @@ -64,36 +58,12 @@ pub fn render_wasm_label(render_state: &mut RenderState) { canvas.draw_str(str, p, debug_font, &paint); } -pub fn render_debug_shape( - render_state: &mut RenderState, - element: &Shape, - intersected: bool, - shapes_pool: &ShapesPool, - modifiers: &HashMap, -) { - let mut paint = skia::Paint::default(); - paint.set_style(skia::PaintStyle::Stroke); - paint.set_color(if intersected { - skia::Color::from_rgb(255, 255, 0) - } else { - skia::Color::from_rgb(0, 255, 255) - }); - paint.set_stroke_width(1.); - - let rect = get_debug_rect(element.extrect(shapes_pool, modifiers)); - render_state - .surfaces - .canvas(SurfaceId::Debug) - .draw_rect(rect, &paint); -} - +#[allow(dead_code)] pub fn render_debug_tiles_for_viewbox(render_state: &mut RenderState) { let tiles::TileRect(sx, sy, ex, ey) = render_state.tile_viewbox.interest_rect; let canvas = render_state.surfaces.canvas(SurfaceId::Debug); let mut paint = skia::Paint::default(); - paint.set_style(skia::PaintStyle::Stroke); - paint.set_color(skia::Color::from_rgb(255, 0, 127)); - paint.set_stroke_width(1.); + paint.set_color(skia::Color::RED); let str_rect = format!("{} {} {} {}", sx, sy, ex, ey); let debug_font = render_state.fonts.debug_font(); @@ -101,12 +71,13 @@ pub fn render_debug_tiles_for_viewbox(render_state: &mut RenderState) { } // Renders the tiles in the viewbox +#[allow(dead_code)] pub fn render_debug_viewbox_tiles(render_state: &mut RenderState) { let scale = render_state.get_scale(); let canvas = render_state.surfaces.canvas(SurfaceId::Debug); let mut paint = skia::Paint::default(); paint.set_style(skia::PaintStyle::Stroke); - paint.set_color(skia::Color::from_rgb(255, 0, 127)); + paint.set_color(skia::Color::MAGENTA); paint.set_stroke_width(1.); let tile_size = tiles::get_tile_size(scale); @@ -130,42 +101,7 @@ pub fn render_debug_viewbox_tiles(render_state: &mut RenderState) { let p = skia::Point::new(debug_rect.x(), debug_rect.y() - 1.); let str = format!("{}:{}", x, y); let debug_font = render_state.fonts.debug_font(); - canvas.draw_str(str, p, debug_font, &paint); - canvas.draw_rect(debug_rect, &paint); - } - } -} - -pub fn render_debug_tiles(render_state: &mut RenderState) { - let scale = render_state.get_scale(); - let canvas = render_state.surfaces.canvas(SurfaceId::Debug); - let mut paint = skia::Paint::default(); - paint.set_style(skia::PaintStyle::Stroke); - paint.set_color(skia::Color::from_rgb(127, 0, 255)); - paint.set_stroke_width(1.); - - let tile_size = tiles::get_tile_size(scale); - let tiles::TileRect(sx, sy, ex, ey) = - tiles::get_tiles_for_rect(render_state.viewbox.area, tile_size); - for y in sy..=ey { - for x in sx..=ex { - let tile = tiles::Tile(x, y); - let shape_count = render_state.tiles.get_shapes_at(tile).iter().len(); - if shape_count == 0 { - continue; - } - - let rect = Rect::from_xywh( - x as f32 * tile_size, - y as f32 * tile_size, - tile_size, - tile_size, - ); - let debug_rect = get_debug_rect(rect); - let p = skia::Point::new(debug_rect.x(), debug_rect.y() - 1.); - let str = format!("{}:{} {}", x, y, shape_count); - - let debug_font = render_state.fonts.debug_font(); + paint.set_style(skia::PaintStyle::Fill); canvas.draw_str(str, p, debug_font, &paint); canvas.draw_rect(debug_rect, &paint); } @@ -173,10 +109,15 @@ pub fn render_debug_tiles(render_state: &mut RenderState) { } pub fn render(render_state: &mut RenderState) { - render_debug_view(render_state); - render_debug_viewbox_tiles(render_state); - render_debug_tiles(render_state); - render_debug_cache_surface(render_state); + // DEBUG VIEWBOX - green rect - buggy? + // render_debug_view(render_state); + + // DEBUG VIEWBOX TILES - magenta - buggy? + // render_debug_viewbox_tiles(render_state); + + // DEBUG CACHE SURFACE - noisy - ? + // render_debug_cache_surface(render_state); + render_state.surfaces.draw_into( SurfaceId::Debug, SurfaceId::Target, @@ -184,6 +125,46 @@ pub fn render(render_state: &mut RenderState) { ); } +pub fn render_workspace_current_tile( + render_state: &mut RenderState, + prefix: String, + tile: tiles::Tile, + rect: skia::Rect, +) { + let canvas = render_state.surfaces.canvas(SurfaceId::Debug); + let mut p = skia::Paint::default(); + p.set_stroke_width(2.); + p.set_style(skia::PaintStyle::Stroke); + canvas.draw_rect(rect, &p); + + let tile_position_origin = skia::Point::new(rect.x() + 10., rect.y() + 20.); + p.set_style(skia::PaintStyle::Fill); + let str = format!("{prefix} {}:{}", tile.0, tile.1); + let mut debug_font = render_state.fonts.debug_font().clone(); + debug_font.set_size(16.); + canvas.draw_str(str, tile_position_origin, &debug_font, &p); +} + +pub fn render_debug_shape( + render_state: &mut RenderState, + shape_selrect: skia::Rect, + shape_extrect: skia::Rect, +) { + let canvas = render_state.surfaces.canvas(SurfaceId::Debug); + + let mut paint = skia::Paint::default(); + paint.set_style(skia::PaintStyle::Stroke); + paint.set_color(skia::Color::RED); + paint.set_stroke_width(1.); + + canvas.draw_rect(shape_selrect, &paint); + + if shape_extrect != shape_selrect { + paint.set_color(skia::Color::BLUE); + canvas.draw_rect(shape_extrect, &paint); + } +} + #[cfg(target_arch = "wasm32")] #[allow(dead_code)] pub fn console_debug_surface(render_state: &mut RenderState, id: SurfaceId) { @@ -208,22 +189,3 @@ pub fn console_debug_surface_rect(render_state: &mut RenderState, id: SurfaceId, run_script!(format!("console.log('%c ', 'font-size: 1px; background: url(data:image/png;base64,{base64_image}) no-repeat; padding: 100px; background-size: contain;')")) } } - -pub fn render_workspace_current_tile( - render_state: &mut RenderState, - prefix: String, - tile: tiles::Tile, - rect: skia::Rect, -) { - let canvas = render_state.surfaces.canvas(SurfaceId::Target); - let mut p = skia::Paint::default(); - p.set_stroke_width(1.); - p.set_style(skia::PaintStyle::Stroke); - canvas.draw_rect(rect, &p); - - let point = skia::Point::new(rect.x() + 10., rect.y() + 20.); - p.set_stroke_width(1.); - let str = format!("{prefix} {}:{}", tile.0, tile.1); - let debug_font = render_state.fonts.debug_font(); - canvas.draw_str(str, point, debug_font, &p); -}