- Introduced a new feature to visualize the Document Object Model (DOM) tree of the loaded web page.
- Implemented keyboard shortcut (Ctrl+Shift+D) for generating and displaying the DOM graph.
- Added core implementation files:
- src/debug/dom_graph.py: Handles generation and rendering of graphs in DOT and SVG formats.
- Created templates and documentation for the new feature, including:
- docs/DOM_VISUALIZATION.md: Overview and usage instructions.
- docs/DOM_GRAPH_UX.md: User experience design documentation.
- Allowed the visualization to open in a new browser tab instead of an external viewer.
- Enhanced visual representation through color coding of different HTML elements.
- Implemented comprehensive tests for graph generation and page rendering.
- Updated README.md to include usage instructions for DOM visualization.
- Included test_holder.html as an example test page.
- Modified various components in the browser to integrate tab management and enhance the graphical rendering experience.
Simplified tab bar implementation:
- Remove complex CSS provider logic that was causing issues
- Simple box-based layout with tab label + close button per tab
- Direct button click handlers with tab reference stored on widget
- Much simpler and more reliable event handling
Tab bar features:
- Each tab shown as: [tab label button] [close button ✕]
- Active tab highlighted with suggested-action style
- Inactive tabs use flat style for cleaner look
- Close button is small and flat (36px width)
- New tab button with ＋ symbol (48px width)
Event handling:
- _on_tab_clicked: Activates the clicked tab
- _on_close_clicked: Closes the clicked tab
- _on_new_tab_clicked: Opens new tab to about:startpage
- Tab reference stored directly on button widget for easy access
Benefits:
- Much simpler codebase
- No complex CSS provider per widget
- Reliable event handling
- Easy to debug and maintain
- No style context issues
All tests passing (15/15)
Enhanced tab widget design:
- Unified tab widget with integrated close button (no visual separation)
- Close button on the right with rounded right corners
- Tab button with rounded left corners for seamless integration
- Custom CSS styling for professional appearance
- Hover effects: close button highlights in warning color
- Tab highlights as suggested-action when active
Visual improvements:
- Tabs have rounded corners (4px radius)
- Proper borders matching theme colors
- Better padding and spacing
- Flat buttons by default except active tab
- Close button marked with ✕ instead of ×
- Better visual feedback on hover
UX improvements:
- Tooltips on all buttons (tab URL, close tab, new tab)
- Small square close button (32px) for easy clicking
- Active tab uses blue suggested-action styling
- Tabs show full URL on hover
- New tab uses about:startpage instead of example.com
CSS styling:
- Theme-aware colors using @view_bg_color, @borders, @warning_color
- Proper border-radius on tab and close button
- Visual separation between tab and close button
- Hover state for better feedback
All tests passing (15/15)
Benefits of libadwaita:
- Modern, polished UI following GNOME Human Interface Guidelines
- Professional HeaderBar with proper navigation button grouping
- Better visual hierarchy and spacing
- Consistent with modern GNOME applications
- Built on GTK 4, same foundation as before
Changes:
- Replace Gtk.ApplicationWindow with Adw.ApplicationWindow
- Use Gtk.HeaderBar for professional top bar with navigation buttons
- Improve address bar presentation (placeholder text, better sizing)
- Add CSS classes for consistent styling (linked, suggested-action, toolbar)
- Better tooltip support for navigation buttons
- Add visual frame around tabs bar
- Improved status bar styling with toolbar class
- Adw.init() called during window creation
UI Improvements:
- Navigation buttons (Back/Forward/Reload) now grouped with linked styling
- Go button highlighted with suggested-action styling
- Address bar uses placeholder text instead of default value
- Better spacing and margins throughout
- More professional appearance overall
All tests passing (23/23 in core modules)
- Support for 301, 302, 303, 307, 308 redirects
- Automatic Location header following
- Relative URL resolution for redirects
- Max redirect limit (default 10) to prevent infinite loops
- 303 (See Other) automatically changes method to GET
- 4 new unit tests for redirect functionality
- All 73 tests passing
- Add tests for URL parsing, cookies, HTML/CSS parsing
- Add tests for browser/tab management and history
- Add tests for layout and rendering components
- Configure pytest with coverage reporting
- Add test documentation and runner commands
- All 54 tests passing
- Added README.md with project description, building instructions, and development milestones.
- Created the project structure with directories for source code, assets, and tests.
- Implemented a basic entry point in main.py with argument parsing and logging configuration.
- Developed preliminary browser orchestration in browser.py, including tab management and navigation.
- Established a GTK-based UI framework in chrome.py, integrating key UI components including the address bar and navigation buttons.
- Incorporated HTTP request handling in http.py, with enhanced logging of requests and responses.
- Added initial assets: logo and images for browser UI.
- Configured dependencies in pyproject.toml for development and runtime environments.
- Initialized version control with uv.lock for dependency management.
