{"slug": "prompt-guidelines-for-vibe-coding", "title": "Prompt guidelines for vibe coding", "summary": "The article provides guidelines for \"vibe coding,\" emphasizing the creation of positive, happy-path tests with one test per feature unless otherwise requested, and instructs developers to run tests in the background without displaying Playwright reports. It also outlines best practices for maintaining codebase consistency, such as using descriptive test names, reliable selectors, and ensuring changes do not break existing functionality. Additionally, the guidelines cover holistic code review, proper documentation updates, and adherence to performance, accessibility, and TypeScript standards.", "body_md": "- Only create positive tests unless explicitly requested to add negative tests or edge cases\n- Focus on happy path scenarios that verify features work as expected\n- One positive test per feature is sufficient unless more comprehensive testing is specifically requested\n- Do not display Playwright reports in the UI\n- Run tests in the background using terminal commands\n- Analyze test results programmatically and provide summary of outcomes\n- Only show test failures or issues that need attention\n- Use clear, descriptive test names that indicate the feature being tested\n- Include proper test setup and cleanup\n- Use reliable selectors (preferably data-testid attributes)\n- Keep tests focused and atomic - one test per specific functionality\n- Do not console.log in the tests as that makes them messy and noisy\n- name test files after the feature they are testing and not generic file names like \"bug-fix\" or \"new-feature\"\n- Always review all changes holistically across the entire codebase\n- Ensure changes are consistent across all related files\n- Verify that modifications don't break existing functionality\n- Check for orphaned references when files are deleted or renamed\n- If files are deleted, remove references from README.md\n- If new files are created, add them to relevant documentation\n- Update project structure diagrams if significant changes are made\n- Keep package.json scripts aligned with actual test files\n- Verify imports/exports are updated when files are moved or renamed\n- Check that routing still works after page component changes\n- Ensure CSS classes and styling remain consistent\n- Validate that test-ids are properly added for new interactive elements\n- Add appropriate data-testid attributes for testable elements\n- Maintain consistent styling and UX patterns\n- Follow existing code patterns and conventions\n- Ensure proper TypeScript typing\n- Implement features incrementally and test at each stage\n- Maintain backwards compatibility unless breaking changes are intentional\n- Consider performance impact of new features\n- Follow accessibility best practices\n- All features should prioritize performance and be as fast as possible.\nThese guidelines should be considered for all development tasks unless specifically overridden by explicit instructions.", "url": "https://wpnews.pro/news/prompt-guidelines-for-vibe-coding", "canonical_source": "https://gist.github.com/nadvolod/4c7c05ec7b089f3d950e506000574786", "published_at": "2025-06-29 13:58:55+00:00", "updated_at": "2026-05-22 18:37:38.558763+00:00", "lang": "en", "topics": ["developer-tools"], "entities": [], "alternates": {"html": "https://wpnews.pro/news/prompt-guidelines-for-vibe-coding", "markdown": "https://wpnews.pro/news/prompt-guidelines-for-vibe-coding.md", "text": "https://wpnews.pro/news/prompt-guidelines-for-vibe-coding.txt", "jsonld": "https://wpnews.pro/news/prompt-guidelines-for-vibe-coding.jsonld"}}