Edit Product: Correct Data in the Form?

The next obvious thing we would build in such a project is editing the product. So let's write the code and the tests for the edit form.

Laravel Code

Before adding the test, we first need an edit form, routes, and controller methods.

app/Http/Controllers/ProductController.php:

use App\Models\Product;
use Illuminate\Contracts\View\View;
use Illuminate\Http\RedirectResponse;
 
class ProductController extends Controller
{
    // ...
 
    public function store(StoreProductRequest $request): RedirectResponse
    {
        Product::create($request->validated());
 
        return redirect()->route('products.index');
    }
 
    public function edit(Product $product): View
    {
        return view('products.edit', compact('product'));
    }
}

routes/web.php:

Route::middleware('auth')->group(function () {
    Route::get('products', [ProductController::class, 'index'])->name('products.index');
 
    Route::middleware('is_admin')->group(function () {
        Route::get('products/create', [ProductController::class, 'create'])->name('products.create');
        Route::post('products', [ProductController::class, 'store'])->name('products.store');
        Route::get('products/{product}/edit', [ProductController::class, 'edit'])->name('products.edit'); 
        Route::put('products/{product}', [ProductController::class, 'update'])->name('products.update'); 
    });
});

We will test the product update in the next lesson, but the routes must be prepared now because we must use it in the form.

resources/views/products/edit.blade.php:

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Edit product') }}
        </h2>
    </x-slot>
 
    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="overflow-hidden overflow-x-auto p-6 bg-white border-b border-gray-200">
                    <div class="min-w-full align-middle">
                        <form method="POST" action="{{ route('products.update', $product) }}">
                            @csrf
                            @method('PUT')
 
                            <div>
                                <x-input-label for="name" :value="__('Name')" />
                                <x-text-input id="name" class="block mt-1 w-full" type="text" name="name" :value="$product->name" required />
                                <x-input-error :messages="$errors->get('name')" class="mt-2" />
                            </div>
 
                            <div class="mt-4">
                                <x-input-label for="price" :value="__('Price')" />
                                <x-text-input id="price" class="block mt-1 w-full" type="text" name="price" :value="$product->price" required />
                                <x-input-error :messages="$errors->get('price')" class="mt-2" />
                            </div>
 
                            <div class="flex items-center mt-4">
                                <x-primary-button>
                                    {{ __('Save') }}
                                </x-primary-button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</x-app-layout>

resources/views/products/index.blade.php:

// ...
<table class="min-w-full divide-y divide-gray-200 border">
    <thead>
    <tr>
        <th class="px-6 py-3 bg-gray-50 text-left">
            <span class="text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">Name</span>
        </th>
        <th class="px-6 py-3 bg-gray-50 text-left">
            <span class="text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">Price (USD)</span>
        </th>
        <th class="px-6 py-3 bg-gray-50 text-left">
            <span class="text-xs leading-4 font-medium text-gray-500 uppercase tracking-wider">Price (EUR)</span>
        </th>
        @if (auth()->user()->is_admin) 
            <th class="px-6 py-3 bg-gray-50 text-left">
            </th>
        @endif 
    </tr>
    </thead>
 
    <tbody class="bg-white divide-y divide-gray-200 divide-solid">
        @forelse($products as $product)
            <tr class="bg-white">
                <td class="px-6 py-4 whitespace-no-wrap text-sm leading-5 text-gray-900">
                    {{ $product->name }}
                </td>
                <td class="px-6 py-4 whitespace-no-wrap text-sm leading-5 text-gray-900">
                    {{ number_format($product->price, 2) }}
                </td>
                <td class="px-6 py-4 whitespace-no-wrap text-sm leading-5 text-gray-900">
                    {{ $product->price_eur }}
                </td>
                @if (auth()->user()->is_admin) 
                    <td class="px-6 py-4 whitespace-no-wrap text-sm leading-5 text-gray-900">
                        <a href="{{ route('products.edit', $product) }}" class="...">
                            Edit
                        </a>
                    </td>
                @endif 
            </tr>
        @empty
            <tr class="bg-white">
                <td colspan="2" class="px-6 py-4 whitespace-no-wrap text-sm leading-5 text-gray-900">
                    {{ __('No products found') }}
                </td>
            </tr>
        @endforelse
    </tbody>
</table>
// ...

When we go to the Edit page, the values in the inputs will be tested by the test method we will create in a minute.

The Test

In the test, we will first use the Factory to create a product and assign it to a variable. Then acting as admin, we will visit...