Skip to content

Implement $wire binding validation for Livewire components#1

Draft
Copilot wants to merge 4 commits intocheckonefrom
copilot/fix-9b256580-2a81-47bb-98b3-2ef0a5d06003
Draft

Implement $wire binding validation for Livewire components#1
Copilot wants to merge 4 commits intocheckonefrom
copilot/fix-9b256580-2a81-47bb-98b3-2ef0a5d06003

Conversation

Copy link

Copilot AI commented Sep 14, 2025

This PR implements the first check for Fuse: $wire Binding Validation. This feature validates that every $wire reference in Blade templates and AlpineJS code maps to a real public property or method on your Livewire component, preventing broken bindings before they hit production.

What's New

php artisan fuse:check Command

A new Artisan command that scans your Livewire components and their associated Blade templates to validate all wire bindings.

php artisan fuse:check

Comprehensive Validation Coverage

Wire Directives: Validates all common Livewire directives including:

  • wire:model, wire:click, wire:submit
  • wire:keydown, wire:keyup, wire:change
  • wire:input, wire:blur, wire:focus
  • And many more event-based directives

AlpineJS $wire References: Validates both property access and method calls:

  • $wire.propertyName - validates property exists
  • $wire.methodName() - validates method exists and is public

Nested Properties: Correctly handles nested property bindings like wire:model="user.name" by validating the root property exists.

Example Usage

Given a Livewire component:

class UserForm extends Component
{
    public $name = '';
    public $email = '';
    
    public function save() { /* ... */ }
    private function helper() { /* ... */ }
}

And a Blade template with issues:

<input wire:model="name">          <!-- ✅ Valid -->
<input wire:model="invalidProp">   <!-- ❌ Invalid -->
<button wire:click="save">Save</button>        <!-- ✅ Valid -->
<button wire:click="helper">Helper</button>    <!-- ❌ Invalid (private) -->

<div x-data="{}">
    <span x-text="$wire.name"></span>           <!-- ✅ Valid -->
    <span x-text="$wire.missing"></span>       <!-- ❌ Invalid -->
    <button @click="$wire.save()">Save</button> <!-- ✅ Valid -->
</div>

The command will output:

❌ Found 3 $wire binding issue(s):

• Missing Property: Property 'invalidProp' referenced in wire:model does not exist or is not public
  File: resources/views/livewire/user-form.blade.php:2

• Missing Method: Method 'helper()' referenced in wire:click does not exist or is not public  
  File: resources/views/livewire/user-form.blade.php:4

• Missing Property: Property 'missing' referenced in $wire property access does not exist or is not public
  File: resources/views/livewire/user-form.blade.php:8

Architecture

The implementation follows a clean, modular architecture:

  • FuseCheckCommand: Artisan command entry point with colorized output
  • WireBindingChecker: Orchestrates the validation process
  • LivewireComponentParser: Analyzes PHP component files using reflection to extract public properties and methods
  • BladeTemplateParser: Uses regex patterns to extract wire directives and $wire references from Blade templates

Component Discovery

Automatically discovers Livewire components in standard locations:

  • app/Livewire/
  • app/Http/Livewire/

And finds associated Blade templates in:

  • resources/views/livewire/

Error Handling

  • Gracefully handles missing or malformed component files
  • Provides detailed error messages with file paths and line numbers
  • Returns appropriate exit codes for CI/CD integration (0 for success, 1 for failures)
  • Distinguishes between missing properties and missing methods

This implementation provides a solid foundation for catching Livewire binding issues early in development, matching the specification in the README for check #1: "$wire Binding Validation".

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

  • https://api.github.com/repos/symfony/polyfill-ctype/zipball/a3cc8b044a6ea513310cbd48ef7333b384945638
    • Triggering command: /usr/bin/php8.3 -n -c /tmp/IHo57V /usr/bin/composer install (http block)
  • https://api.github.com/repos/webmozarts/assert/zipball/11cb2199493b2f8a3b53e7f19068fc6aac760991
    • Triggering command: /usr/bin/php8.3 -n -c /tmp/IHo57V /usr/bin/composer install (http block)

If you need me to access, download, or install something from one of these locations, you can either:


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copilot AI and others added 3 commits September 14, 2025 16:38
Co-authored-by: tnylea <601261+tnylea@users.noreply.github.com>
Co-authored-by: tnylea <601261+tnylea@users.noreply.github.com>
Co-authored-by: tnylea <601261+tnylea@users.noreply.github.com>
Copilot AI changed the title [WIP] Please implement the following check. When the user runs php artisan fuse:check we need to parse through all the Livewire components and verify that all the wire:click, wire:bind, and $wire. have corresponding methods or properties. here's the speck ... Implement $wire binding validation for Livewire components Sep 14, 2025
Copilot AI requested a review from tnylea September 14, 2025 16:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

Comments