auchenberg/vscode-browser-preview
Vscode Browser Preview
vscode-browser-preview est un prévisualiseur web basé sur l'éditeur et un débogueur intégré qui embarque une instance de navigateur en direct directement dans l'espace de travail. Il utilise une intégration de navigateur headless pour synchroniser l'état du navigateur avec l'éditeur de code actif.
Le projet fournit un débogueur web intégré qui permet aux utilisateurs de définir des points d'arrêt et d'inspecter l'état des applications web sans quitter l'interface de l'éditeur. Il permet également l'accès aux outils de développement distants via une URL réseau pour analyser les éléments de page, les styles et l'activité réseau.
Le système prend en charge les flux de travail de développement frontend en fournissant des prévisualisations web dans l'éditeur pour une visualisation en temps réel des styles et des mises en page. Cela inclut des capacités d'inspection de l'état du navigateur et de débogage d'applications web.
Features
- Editor Live Previews - Provides a live web page preview directly inside the code editor to eliminate switching between environments.
- Chrome Debugging Interfaces - Utilizes the Chrome DevTools Protocol to provide programmatic browser control and execution state inspection.
- Debugger Integrations - Integrates a debugger that lets users set breakpoints and inspect web application state inside the editor.
- Integrated Debuggers - Provides an integrated debugger within the editor for setting breakpoints and inspecting code execution.
- VS Code Extensions - Provides a specialized browser preview and debugging integration as a VS Code extension.
- Frontend Development - Facilitates a frontend development workflow by providing real-time visual feedback on styles and layouts.
- Web Application Debugging - Connects a debugger to a browser instance to set breakpoints and inspect code execution within the editor.
- Headless Browser Orchestrators - Manages a separate headless browser instance to render web content and expose it within the editor.
- Browser DevTools Inspections - Allows analysis of page elements and network activity using integrated browser developer tools.
- Remote DevTools Access - Enables remote developer tools access via a network URL to analyze page elements, styles, and network activity.
- Process Isolation Architectures - Runs the browser as a separate system process to maintain editor stability and avoid thread blocking.
- Webview Content Renderers - Renders the remote browser output inside a sandboxed HTML container embedded within the editor user interface.
