ckeditor5 1.20.1 → 1.22.0

data/lib/ckeditor5/rails/editor/props.rb

@@ -14,16 +14,17 @@ module CKEditor5::Rails::Editor
     }.freeze
 
     def initialize(
-      controller_context, type, config,
-      watchdog: true, editable_height: nil, language: nil
+      type, config,
+      bundle: nil,
+      watchdog: true,
+      editable_height: nil
     )
       raise ArgumentError, "Invalid editor type: #{type}" unless Props.valid_editor_type?(type)
 
-      @controller_context = controller_context
+      @bundle = bundle
       @watchdog = watchdog
       @type = type
       @config = config
-      @language = language
       @editable_height = EditableHeightNormalizer.new(type).normalize(editable_height)
     end
 
@@ -40,11 +41,11 @@ module CKEditor5::Rails::Editor
 
     private
 
-    attr_reader :controller_context, :watchdog, :type, :config, :editable_height
+    attr_reader :bundle, :watchdog, :type, :config, :editable_height
 
     def serialized_attributes
       {
-        translations: serialize_translations,
+        bundle: bundle.to_json,
         plugins: serialize_plugins,
         config: serialize_config,
         watchdog: watchdog
@@ -52,10 +53,6 @@ module CKEditor5::Rails::Editor
         .merge(editable_height ? { 'editable-height' => editable_height } : {})
     end
 
-    def serialize_translations
-      controller_context[:bundle]&.translations_scripts&.map(&:to_h).to_json || '[]'
-    end
-
     def serialize_plugins
       (config[:plugins] || []).map { |plugin| PropsBasePlugin.normalize(plugin).to_h }.to_json
     end
@@ -63,10 +60,6 @@ module CKEditor5::Rails::Editor
     def serialize_config
       config
         .except(:plugins)
-        .tap do |cfg|
-          cfg[:licenseKey] = controller_context[:license_key] if controller_context[:license_key]
-          cfg[:language] = { ui: @language } if @language
-        end
         .to_json
     end
   end

data/lib/ckeditor5/rails/engine.rb

@@ -7,6 +7,8 @@ require_relative 'plugins/simple_upload_adapter'
 require_relative 'plugins/wproofreader'
 
 module CKEditor5::Rails
+  class PresetNotFoundError < ArgumentError; end
+
   class Engine < ::Rails::Engine
     config.ckeditor5 = ActiveSupport::OrderedOptions.new
     config.ckeditor5.presets = Presets::Manager.new
@@ -47,6 +49,10 @@ module CKEditor5::Rails
         config.ckeditor5.presets.default
       end
 
+      def presets
+        config.ckeditor5.presets
+      end
+
       def configure(&block)
         proxy = ConfigurationProxy.new(config.ckeditor5)
         proxy.instance_eval(&block)
@@ -57,6 +63,13 @@ module CKEditor5::Rails
 
         base.presets[preset]
       end
+
+      def find_preset!(preset)
+        found_preset = find_preset(preset)
+        return found_preset if found_preset.present?
+
+        raise PresetNotFoundError, "Preset '#{preset}' not found. Please define it in the initializer."
+      end
     end
 
     class ConfigurationProxy

data/lib/ckeditor5/rails/presets/manager.rb

@@ -8,6 +8,8 @@ module CKEditor5::Rails::Presets
   class Manager
     attr_reader :presets
 
+    alias to_h presets
+
     # Initializes a new Manager instance and sets up the default preset
     def initialize
       @presets = {}

data/lib/ckeditor5/rails/presets/preset_builder.rb

@@ -86,7 +86,7 @@ module CKEditor5::Rails
       # Merge preset with configuration hash
       # @param overrides [Hash] Configuration options to merge
       # @return [self]
-      def merge_with_hash!(**overrides) # rubocop:disable Metrics/AbcSize
+      def merge_with_hash!(**overrides)
         @version = Semver.new(overrides[:version]) if overrides.key?(:version)
         @premium = overrides.fetch(:premium, premium)
         @cdn = overrides.fetch(:cdn, cdn)

data/lib/ckeditor5/rails/presets/toolbar_builder.rb

@@ -1,13 +1,46 @@
 # frozen_string_literal: true
 
 module CKEditor5::Rails::Presets
+  # Builder class for configuring CKEditor5 toolbar items.
+  #
+  # @example Basic toolbar configuration
+  #   toolbar = ToolbarBuilder.new([:bold, :italic])
+  #   toolbar.append(:link)
+  #   toolbar.prepend(:heading)
   class ToolbarBuilder
     attr_reader :items
 
+    # Initialize a new toolbar builder with given items.
+    #
+    # @param items [Array<Symbol>] Initial toolbar items
+    # @example Create new toolbar
+    #   ToolbarBuilder.new([:bold, :italic, :|, :link])
     def initialize(items)
       @items = items
     end
 
+    # Returns toolbar line break symbol
+    #
+    # @return [Symbol] Line break symbol (-)
+    # @example Add line break to toolbar
+    #   toolbar do
+    #     append :bold, break_line, :italic
+    #   end
+    def break_line
+      :-
+    end
+
+    # Returns toolbar separator symbol
+    #
+    # @return [Symbol] Separator symbol (|)
+    # @example Add separator to toolbar
+    #   toolbar do
+    #     append :bold, separator, :italic
+    #   end
+    def separator
+      :|
+    end
+
     # Remove items from the editor toolbar.
     #
     # @param removed_items [Array<Symbol>] Toolbar items to be removed
@@ -16,7 +49,9 @@ module CKEditor5::Rails::Presets
     #     remove :underline, :heading
     #   end
     def remove(*removed_items)
-      removed_items.each { |item| items.delete(item) }
+      items.delete_if do |existing_item|
+        removed_items.any? { |item_to_remove| item_matches?(existing_item, item_to_remove) }
+      end
     end
 
     # Prepend items to the editor toolbar.
@@ -34,7 +69,7 @@ module CKEditor5::Rails::Presets
     # @raise [ArgumentError] When the specified 'before' item is not found
     def prepend(*prepended_items, before: nil)
       if before
-        index = items.index(before)
+        index = find_item_index(before)
         raise ArgumentError, "Item '#{before}' not found in array" unless index
 
         items.insert(index, *prepended_items)
@@ -58,7 +93,7 @@ module CKEditor5::Rails::Presets
     # @raise [ArgumentError] When the specified 'after' item is not found
     def append(*appended_items, after: nil)
       if after
-        index = items.index(after)
+        index = find_item_index(after)
         raise ArgumentError, "Item '#{after}' not found in array" unless index
 
         items.insert(index + 1, *appended_items)
@@ -66,5 +101,84 @@ module CKEditor5::Rails::Presets
         items.push(*appended_items)
       end
     end
+
+    # Find group by name in toolbar items
+    #
+    # @param name [Symbol] Group name to find
+    # @return [ToolbarGroupItem, nil] Found group or nil
+    def find_group(name)
+      items.find { |item| item.is_a?(ToolbarGroupItem) && item.name == name }
+    end
+
+    # Remove group by name from toolbar items
+    #
+    # @param name [Symbol] Group name to remove
+    def remove_group(name)
+      items.delete_if { |item| item.is_a?(ToolbarGroupItem) && item.name == name }
+    end
+
+    # Create and add new group to toolbar
+    #
+    # @param name [Symbol] Group name
+    # @param options [Hash] Group options (label:, icons:)
+    # @param block [Proc] Configuration block
+    # @return [ToolbarGroupItem] Created group
+    def group(name, **options, &block)
+      group = ToolbarGroupItem.new(name, [], **options)
+      group.instance_eval(&block) if block_given?
+      items << group
+      group
+    end
+
+    private
+
+    # Find index of an item or group by name
+    #
+    # @param item [Symbol] Item or group name to find
+    # @return [Integer, nil] Index of the found item or nil
+    def find_item_index(item)
+      items.find_index { |existing_item| item_matches?(existing_item, item) }
+    end
+
+    # Checks if the existing item matches the given item or group name
+    #
+    # @param existing_item [Symbol, ToolbarGroupItem] Item to check
+    # @param item [Symbol] Item or group name to match against
+    # @return [Boolean] true if items match, false otherwise
+    # @example Check if items match
+    #   item_matches?(:bold, :bold)           # => true
+    #   item_matches?(group(:text), :text)    # => true
+    def item_matches?(existing_item, item)
+      if existing_item.is_a?(ToolbarGroupItem)
+        existing_item.name == item
+      else
+        existing_item == item
+      end
+    end
+  end
+
+  # Builder class for configuring CKEditor5 toolbar groups.
+  # Allows creating named groups of toolbar items with optional labels and icons.
+  #
+  # @example Creating a text formatting group
+  #   group = ToolbarGroupItem.new(:text_formatting, [:bold, :italic], label: 'Text')
+  #   group.append(:underline)
+  class ToolbarGroupItem < ToolbarBuilder
+    attr_reader :name, :label, :icon
+
+    # Initialize a new toolbar group item.
+    #
+    # @param name [Symbol] Name of the toolbar group
+    # @param items [Array<Symbol>, ToolbarBuilder] Items to be included in the group
+    # @param label [String, nil] Optional label for the group
+    # @param icon [String, nil] Optional icon for the group
+    # @example Create a new toolbar group
+    #   ToolbarGroupItem.new(:text, [:bold, :italic], label: 'Text formatting')
+    def initialize(name, items = [], label: nil, icon: nil)
+      super(items)
+      @name = name
+      @label = label
+      @icon = icon
+    end
   end
 end

data/lib/ckeditor5/rails/version.rb

@@ -2,7 +2,7 @@
 
 module CKEditor5
   module Rails
-    VERSION = '1.20.1'
+    VERSION = '1.22.0'
 
     DEFAULT_CKEDITOR_VERSION = '44.0.0'
   end

data/spec/e2e/features/ajax_form_integration_spec.rb

@@ -0,0 +1,78 @@
+# frozen_string_literal: true
+
+require 'e2e/spec_helper'
+
+RSpec.describe 'AJAX Form Integration', type: :feature, js: true do
+  before do
+    visit('form_ajax')
+    setup_form_tracking(page)
+  end
+
+  shared_examples 'an ajax form with CKEditor' do |form_testid, editor_testid, submit_testid, response_id| # rubocop:disable Metrics/BlockLength
+    let(:form) { find("[data-testid='#{form_testid}']") }
+    let(:editor) { find("[data-testid='#{editor_testid}']") }
+    let(:editable) { editor.find('.ck-editor__editable') }
+    let(:text_field) { editor.find('textarea', visible: :hidden) }
+    let(:submit_button) { find("[data-testid='#{submit_testid}']") }
+    let(:response_container) { find("##{response_id}") }
+
+    before do
+      expect(page).to have_css('.ck-editor__editable', wait: 10)
+    end
+
+    it 'loads editor properly' do
+      expect(page).to have_css("[data-testid='#{editor_testid}'] .ck-editor__editable")
+      expect(editor).to have_invisible_textarea
+    end
+
+    it 'validates required fields' do
+      editable.click
+      editable.send_keys([[:control, 'a'], :backspace])
+      text_field.set('')
+      submit_button.click
+
+      expect(form).not_to have_been_submitted
+      expect(text_field).to be_invalid
+    end
+
+    it 'submits form and shows response' do
+      test_content = "Test content #{Time.now.to_i}"
+
+      editable.click
+      editable.send_keys([[:control, 'a'], :backspace])
+      editable.send_keys(test_content)
+
+      sleep 1
+
+      submit_button.click
+
+      eventually(timeout: 13) do
+        expect(response_container).to be_visible
+        expect(response_container).to have_text('Success!')
+        expect(response_container).to have_text(test_content)
+
+        # Verify that CKEditor initializes in the response
+        response_editor = response_container.find('.ck-editor__editable', wait: 10)
+
+        expect(response_editor).to be_visible
+        expect(response_editor).to have_text(test_content)
+      end
+    end
+  end
+
+  describe 'Regular AJAX form' do
+    it_behaves_like 'an ajax form with CKEditor',
+                    'rails-form',
+                    'rails-form-editor',
+                    'rails-form-submit',
+                    'response'
+  end
+
+  describe 'Turbo Stream form' do
+    it_behaves_like 'an ajax form with CKEditor',
+                    'rails-form-stream',
+                    'rails-form-editor-stream',
+                    'rails-form-submit-stream',
+                    'response-stream'
+  end
+end

data/spec/e2e/features/lazy_assets_spec.rb

@@ -0,0 +1,54 @@
+# frozen_string_literal: true
+
+require 'e2e/spec_helper'
+
+RSpec.describe 'Lazy Assets', type: :feature do
+  context 'without JavaScript', js: false do
+    before do
+      visit 'classic_lazy_assets?no_embed=true'
+    end
+
+    it 'does not load CKEditor assets' do
+      expect(page).not_to have_css('link[href*="ckeditor5"]', visible: false)
+      expect(page).not_to have_css('script[src*="ckeditor5"]', visible: false)
+
+      scripts = page.all('script:not([type="importmap"]):not([type="module"])', visible: false)
+      external_scripts = scripts.reject { |s| s[:src].nil? }
+      expect(external_scripts).not_to include(match(/ckeditor5/))
+
+      expect(page).to have_css('script[type="importmap"]', visible: false)
+    end
+  end
+
+  context 'with JavaScript', js: true do
+    before { visit 'classic_lazy_assets' }
+
+    it 'loads editor when needed' do
+      expect(page).to have_css('.ck-editor__editable', wait: 10)
+      expect(page).to have_css('link[href*="ckeditor5"]', visible: false)
+    end
+
+    it 'initializes editor properly' do
+      editor = find('.ck-editor__editable')
+      expect(editor).to be_visible
+
+      editor.click
+      editor.send_keys('Test content')
+
+      expect(editor).to have_text('Test content')
+    end
+
+    it 'supports multiple editor instances' do
+      visit 'classic_lazy_assets?multiple=true'
+
+      editors = all('.ck-editor__editable', wait: 10)
+      expect(editors.length).to eq(2)
+
+      editors.each do |editor|
+        editor.click
+        editor.send_keys('Content for editor')
+        expect(editor).to have_text('Content for editor')
+      end
+    end
+  end
+end

data/spec/e2e/support/form_helpers.rb

@@ -6,7 +6,10 @@ module FormHelpers
       window.lastSubmittedForm = null;
 
       document.addEventListener('submit', (e) => {
-        e.preventDefault();
+        if (!e.target.hasAttribute('data-turbo-frame')) {
+          e.preventDefault();
+        }
+
         window.lastSubmittedForm = e.target.id;
       });
     JS

data/spec/lib/ckeditor5/rails/assets/assets_bundle_hml_serializer_spec.rb

@@ -138,6 +138,59 @@ RSpec.describe CKEditor5::Rails::Assets::AssetsBundleHtmlSerializer do
                                  nonce: 'true'
                                })
     end
+
+    context 'with lazy loading' do
+      subject(:html) { described_class.new(bundle, lazy: true).to_html }
+
+      it 'does not include preload tags' do
+        expect(html).not_to have_tag('link', with: { rel: 'preload' })
+        expect(html).not_to have_tag('link', with: { rel: 'modulepreload' })
+      end
+
+      it 'does not include stylesheet links' do
+        stylesheets.each do |url|
+          expect(html).not_to have_tag('link', with: { href: url, rel: 'stylesheet' })
+        end
+      end
+
+      it 'does not include window script tags' do
+        scripts.each do |script|
+          expect(html).not_to have_tag('script', with: { src: script.url }) if script.window?
+        end
+      end
+
+      it 'includes web component script' do
+        expect(html).to have_tag('script', with: { type: 'module' })
+      end
+    end
+
+    context 'with eager loading (lazy: false)' do
+      subject(:html) { described_class.new(bundle, lazy: false).to_html }
+
+      it 'includes preload tags' do
+        scripts.each do |script|
+          expect(html).to have_tag('link', with: {
+                                     href: script.url,
+                                     rel: script.esm? ? 'modulepreload' : 'preload'
+                                   })
+        end
+      end
+
+      it 'includes stylesheet links' do
+        stylesheets.each do |url|
+          expect(html).to have_tag('link', with: {
+                                     href: url,
+                                     rel: 'stylesheet'
+                                   })
+        end
+      end
+
+      it 'includes window script tags' do
+        scripts.each do |script|
+          expect(html).to have_tag('script', with: { src: script.url }) if script.window?
+        end
+      end
+    end
   end
 
   describe '.url_resource_preload_type' do

data/spec/lib/ckeditor5/rails/assets/assets_bundle_spec.rb

@@ -115,7 +115,8 @@ RSpec.describe CKEditor5::Rails::Assets::JSUrlImportMeta do
       expect(meta.to_h).to eq({
                                 url: url,
                                 import_name: 'module',
-                                import_as: 'alias'
+                                import_as: 'alias',
+                                translation: false
                               })
     end
   end

data/spec/lib/ckeditor5/rails/cdn/helpers_spec.rb

@@ -35,10 +35,15 @@ RSpec.describe CKEditor5::Rails::Cdn::Helpers do
   end
 
   before do
-    allow(CKEditor5::Rails::Engine).to receive(:find_preset).and_return(preset)
+    allow(CKEditor5::Rails::Engine).to receive(:find_preset!).and_return(preset)
     allow(CKEditor5::Rails::Assets::AssetsBundleHtmlSerializer).to receive(:new).and_return(serializer)
   end
 
+  after do
+    RSpec::Mocks.space.proxy_for(CKEditor5::Rails::Engine).reset
+    RSpec::Mocks.space.proxy_for(CKEditor5::Rails::Assets::AssetsBundleHtmlSerializer).reset
+  end
+
   describe '#ckeditor5_assets' do
     context 'with valid preset' do
       it 'creates base bundle' do
@@ -206,12 +211,13 @@ RSpec.describe CKEditor5::Rails::Cdn::Helpers do
 
     context 'destructure non-matching preset override' do
       before do
-        allow(CKEditor5::Rails::Engine).to receive(:find_preset).and_return(nil)
+        RSpec::Mocks.space.proxy_for(CKEditor5::Rails::Engine).reset
       end
 
       it 'raises error' do
         expect { helper.ckeditor5_assets(preset: :invalid) }
-          .to raise_error(ArgumentError, /forgot to define your invalid preset/)
+          .to raise_error(CKEditor5::Rails::PresetNotFoundError)
+        RSpec::Mocks.space.proxy_for(CKEditor5::Rails::Engine).reset
       end
     end
 
@@ -256,6 +262,92 @@ RSpec.describe CKEditor5::Rails::Cdn::Helpers do
     end
   end
 
+  describe '#ckeditor5_lazy_javascript_tags' do
+    let(:web_component_html) do
+      '<script type="module" src="web-component.js">web component code</script>'.html_safe
+    end
+
+    let(:import_map_html) { '<script type="importmap">{"imports":{}}</script>'.html_safe }
+
+    let(:web_component_bundle) do
+      instance_double(CKEditor5::Rails::Assets::WebComponentBundle, to_html: web_component_html)
+    end
+    let(:import_map_bundle) do
+      instance_double(CKEditor5::Rails::Assets::AssetsImportMap, to_html: import_map_html)
+    end
+    let(:preset_manager) { instance_double(CKEditor5::Rails::Presets::Manager) }
+    let(:test_preset1) { instance_double(CKEditor5::Rails::Presets::PresetBuilder) }
+    let(:test_preset2) { instance_double(CKEditor5::Rails::Presets::PresetBuilder) }
+
+    before do
+      allow(CKEditor5::Rails::Assets::WebComponentBundle).to receive(:instance).and_return(
+        web_component_bundle
+      )
+
+      allow(CKEditor5::Rails::Assets::AssetsImportMap).to receive(:new).and_return(
+        import_map_bundle
+      )
+
+      allow(CKEditor5::Rails::Engine).to receive(:presets).and_return(preset_manager)
+      allow(preset_manager).to receive(:to_h).and_return({
+                                                           test1: test_preset1,
+                                                           test2: test_preset2
+                                                         })
+
+      allow(helper).to receive(:create_preset_bundle).with(test_preset1)
+                                                     .and_return(CKEditor5::Rails::Assets::AssetsBundle.new(
+                                                                   scripts: ['test1.js']
+                                                                 ))
+
+      allow(helper).to receive(:create_preset_bundle).with(test_preset2)
+                                                     .and_return(CKEditor5::Rails::Assets::AssetsBundle.new(
+                                                                   scripts: ['test2.js']
+                                                                 ))
+    end
+
+    context 'when importmap is available' do
+      before do
+        allow(helper).to receive(:importmap_available?).and_return(true)
+        allow(helper).to receive(:importmap_rendered?).and_return(false)
+      end
+
+      it 'stores bundle in context and returns web component script' do
+        result = helper.ckeditor5_lazy_javascript_tags
+
+        expect(result).to have_tag('script', with: {
+                                     type: 'module',
+                                     src: 'web-component.js'
+                                   })
+        expect(context[:bundle].scripts).to match_array(['test1.js', 'test2.js'])
+      end
+
+      it 'raises error when importmap is already rendered' do
+        allow(helper).to receive(:importmap_rendered?).and_return(true)
+
+        expect { helper.ckeditor5_lazy_javascript_tags }
+          .to raise_error(CKEditor5::Rails::Cdn::Helpers::ImportmapAlreadyRenderedError)
+      end
+    end
+
+    context 'when importmap is not available' do
+      before do
+        allow(helper).to receive(:importmap_available?).and_return(false)
+      end
+
+      it 'returns both importmap and web component scripts as one string' do
+        result = helper.ckeditor5_lazy_javascript_tags
+
+        expect(result).to have_tag('script', with: { type: 'importmap' },
+                                             text: '{"imports":{}}')
+
+        expect(result).to have_tag('script', with: {
+                                     type: 'module',
+                                     src: 'web-component.js'
+                                   })
+      end
+    end
+  end
+
   describe 'cdn helper methods' do
     it 'generates helper methods for third-party CDNs' do
       expect(helper).to respond_to(:ckeditor5_unpkg_assets)