Tinymce Bundle Laravel Package

Technical Evaluation

Architecture Fit

• Symfony/Laravel Compatibility: The package is Symfony-focused (not Laravel-native), but its core functionality (TinyMCE 6 Web Component integration) is language-agnostic. Laravel’s Blade templating can mirror Symfony’s Twig usage (e.g., {{ tinymce() }} → @tinymce()), but requires manual adaptation (e.g., asset paths, form handling).
• Component-Based Design: Leverages TinyMCE’s Web Component API, which aligns with modern SPAs and Laravel’s incremental adoption of frontend frameworks (e.g., Livewire, Inertia.js). The bundle abstracts TinyMCE’s complexity behind a Symfony Form Type and Twig functions, making it easier to integrate into Laravel’s form system (e.g., FormRequest, Fillable models).
• Configuration Flexibility: Supports global defaults (via config/tinymce.yaml) and per-instance overrides (via form options or Twig attributes). This maps well to Laravel’s service container and config caching patterns.

Integration Feasibility

• Low-Coupling: The bundle does not enforce Laravel-specific dependencies (e.g., no Eloquent or Blade requirements). Integration hinges on:
  • Asset Pipeline: TinyMCE’s JS/CSS must be loaded (via Laravel Mix/Vite or CDN). The bundle provides asset paths, but Laravel’s public_path() must replace Symfony’s asset().
  • Form Integration: Laravel’s FormRequest or Request objects can replace Symfony’s FormBuilderInterface. Example:

    use Eckinox\TinyMceBundle\Form\Type\TinymceType; // Alias or fork for Laravel
    $builder->add('content', TinymceType::class, ['attr' => ['toolbar' => 'bold']]);
    

  • File Uploads: The provided TinyMceUploadController is Symfony-centric but can be adapted to Laravel’s UploadedFile handling and route system.
• Twig Alternative: Laravel’s Blade lacks Twig’s tinymce() function, but a custom Blade directive can replicate it:

  Blade::directive('tinymce', function ($content) {
      return "<?php echo \Eckinox\TinyMceBundle\Twig\TinymceExtension::renderTinymce($content); ?>";
  });
  

Technical Risk

• Symfony Dependencies: The bundle relies on Symfony’s Form Component and Twig. Laravel’s FormRequest and Blade are not drop-in replacements, requiring:
  • Form Type Adaptation: Extend AbstractType to bridge Laravel’s FormBuilder with Symfony’s TinymceType.
  • Twig Emulation: Replace Twig functions with Blade directives or Laravel’s View Composer.
• Asset Management: TinyMceBundle assumes Symfony’s asset pipeline. Laravel projects must:
  • Publish bundle assets to public/bundles/tinymce (via php artisan vendor:publish or manual copy).
  • Configure Vite/Laravel Mix to handle TinyMCE’s JS/CSS (e.g., @vite(['resources/bundles/tinymce/tinymce.min.js'])).
• File Uploads: The example controller uses Symfony’s UploadedFile and routing. Laravel’s StoreRequest or UploadedFile handling requires rewriting the endpoint logic (e.g., CORS headers, file validation).
• Version Lock: TinyMCE 6.8.2 may introduce breaking changes if not pinned in composer.json:

  "require": {
      "eckinox/tinymce-bundle": "^1.1",
      "tinymce/tinymce": "^6.8"
  }
  

Key Questions

1. Laravel-Specific Features:
   • Does the team need Eloquent model binding (e.g., auto-saving TinyMCE content to a content column)?
   • Should the bundle be forked to replace Symfony’s FormBuilderInterface with Laravel’s FormBuilder?
2. Frontend Stack:
   • Is TinyMCE’s Web Component compatible with the current Laravel Mix/Vite setup (e.g., no conflicts with existing JS bundles)?
   • Will the AppStack skin (dark/light modes) align with the app’s design system?
3. Performance:
   • What’s the bundle size impact (TinyMCE + Web Component ~500KB minified)? Is lazy-loading feasible?
   • How will file uploads scale (e.g., S3 vs. local storage, chunked uploads)?
4. Maintenance:
   • Who will handle Symfony-specific updates (e.g., Symfony 7 compatibility) in a Laravel project?
   • Is there a Laravel-specific fork or community wrapper (e.g., spatie/tinymce-laravel) that reduces risk?

Integration Approach

Stack Fit

• Laravel Core: The bundle’s Form Type and Twig functions can be adapted to Laravel’s:
  • Form Requests: Replace FormBuilderInterface with Laravel’s FormRequest handling.
  • Blade Directives: Emulate Twig’s tinymce() via custom Blade syntax.
  • Service Container: Bind TinyMCE configurations to Laravel’s config() system.
• Frontend:
  • Vite/Laravel Mix: Publish TinyMCE assets to public/bundles/tinymce and import via @vite.
  • Livewire/Inertia.js: TinyMCE’s Web Component can integrate with these frameworks (e.g., pass props for dynamic configs).
• Database:
  • Eloquent: Use Observers or Accessors to sanitize TinyMCE HTML before saving (e.g., strip scripts).
  • Media Library: Pair with packages like spatie/laravel-medialibrary for image uploads.

Migration Path

1. Phase 1: Proof of Concept (1–2 days)
   • Install the bundle via Composer (with Symfony dependencies hidden via replace in composer.json).
   • Adapt the Form Type to Laravel’s AbstractType:

     namespace App\Form\Type;
     use Eckinox\TinyMceBundle\Form\Type\TinymceType as SymfonyTinymceType;
     use Symfony\Component\Form\AbstractType;
     use Symfony\Component\Form\FormBuilderInterface;
     
     class TinymceType extends AbstractType {
         public function buildForm(FormBuilderInterface $builder, array $options) {
             $builder->addViewTransformer(new TinyMceTransformer());
         }
     }
     

   • Test Blade integration with a custom directive.
2. Phase 2: Core Integration (3–5 days)
   • Replace Symfony’s asset() with Laravel’s asset() in asset paths.
   • Implement file uploads using Laravel’s UploadedFile and a dedicated controller:

     public function upload(Request $request) {
         $file = $request->file('file');
         $path = $file->store('tinymce', 'public');
         return response()->json(['location' => asset("storage/$path")]);
     }
     

   • Configure global defaults in config/tinymce.php (mapped to Laravel’s config('tinymce')).
3. Phase 3: Polish (1–2 days)
   • Add Laravel-specific features (e.g., Eloquent model binding, Blade helpers).
   • Optimize asset loading (e.g., lazy-load TinyMCE or split into chunks).
   • Write tests for form submission, file uploads, and Blade rendering.

Compatibility

Sequencing

1. Critical Path:
   • Form Type adaptation → Blade directive → File upload endpoint.