Action cable not working I have to refresh both the tab to see message
<p>Here is code of room.coffee :</p>

<pre><code>App.room = App.cable.subscriptions.create "RoomChannel",
  connected: -&gt; 
  disconnected: -&gt; 

  received: (data) -&gt;
    $('#messages').append "&lt;p&gt;#{data}&lt;/p&gt;"    

  speak: (message) -&gt;
    @perform 'speak' , message: message
</code></pre>

<p>cable.coffee :</p>

<pre><code>@App ||= {}
App.cable = ActionCable.createConsumer()
</code></pre>

<p>rooms.coffee:</p>

<pre><code>$ -&gt;
    $messages = $('messages')
    $messages.scrollTop $messages.prop('scrollHieght')
    $('#message_input').focus()

$(document).on 'keypress','message_input','e'-&gt;
    if e.keycode == 13 and e.target.value
    App.room.speak(e.target.value)
    e.target.value = ''
    e.preventDefault()
</code></pre>

<p>roomchannel:</p>

<pre><code>class RoomChannel &lt; ApplicationCable::Channel
  def subscribed
     stream_from "room_channel"
  end

  def unsubscribed
    # Any cleanup needed when channel is unsubscribed
  end

  def speak(data)
    message.create content: data['message']
  end
end
</code></pre>

<p>Broadcostmessage:</p>

<pre><code> def perform(message)
    Actioncable.server.broadcast 'room_channel',render_message(message)
  end
  private
  def render_message(message)
    ApplicationController.renderer.render_message
  end
</code></pre>

<p>when create the new message it will not automatically load  all the messages of my browser untill the page in not reload.</p>