ActionCableを使ったチャット機能を実装したい

前提・実現したいこと

rails 6.0.3

ActionCableを使ったチャット機能を実装するために、一先ず参考書の写経を行って動きを確かめようとしているのですが、上手くいきません。フォームからの文字入力は受け付けるのですが、そこからspeakアクションに行く前にエラーが出てしまい、値の保存ができません。「未定義のローカル変数またはメソッド～」あるので、恐らく記述ミスだとは思うのですが、何度も見直しても見つかりません。。
アドバイス頂けると助かります。

発生している問題・エラーメッセージ

Could not execute command from ({"command"=>"message", "identifier"=>"{\"channel\":\"RoomChannel\"}", "data"=>"{\"message\":\"asdasd\",\"action\":\"speak\"}"}) [NameError - undefined local variable or method `　' for #<RoomChannel:0x00005607a5138550>]: /home/ubuntu/environment/ac-sample/app/channels/room_channel.rb:10:in `speak' | /home/ubuntu/.rvm/gems/ruby-2.6.3/gems/actioncable-6.0.3.3/lib/action_cable/channel/base.rb:268:in `public_send' | /home/ubuntu/.rvm/gems/ruby-2.6.3/gems/actioncable-6.0.3.3/lib/action_cable/channel/base.rb:268:in `dispatch_action' | /home/ubuntu/.rvm/gems/ruby-2.6.3/gems/actioncable-6.0.3.3/lib/action_cable/channel/base.rb:170:in `block in perform_action' | /home/ubuntu/.rvm/gems/ruby-2.6.3/gems/activesupport-6.0.3.3/lib/active_support/notifications.rb:182:in `instrument'

該当のソースコード

#romm_channel.rb

class RoomChannel < ApplicationCable::Channel
  def subscribed
    stream_from "room_channel"
  end

～省略～

  def speak(data)
    byebug #←作動しない
    message = Message.create(content: data["message"])
    ActionCable.server.broadcast(
      "room_channel", { message: render_message(message) }
)
  end
  
  private
    
    def render_message(message)
      ApplicationController.render(
        partial: "messages/message",
        locals: { message: message }
      )
    end

end

//room_channel.js

import consumer from "./consumer"

consumer.subscriptions.create("RoomChannel", {
  connected() {
    document.
      querySelector('input[data-behavior="room_speaker"]').
      addEventListener('keypress', (event) => {
        if (event.key === 'Enter') { 
          this.speak(event.target.value);
          event.target.value = '';   
          return event.preventDefault();
        }
      });
    },

～省略～

  received(data) {
    const element = document.querySelector('#messages')
    element.insertAdjacentHTML('beforeend', data['message'])
  },

  speak: function(message) {
    return this.perform('speak', {message: message});
  },
});

<!--rooms/show-->

<h1>ChatRoom</h1>

<div id="messages">
  <%= render @messages %>
</div>

<form>
  <label>Say something:</label><br>
  <input type="text" data-behavior="room_speaker">
</form>