Moved to own ticket sidebar to cover use cases.

app/assets/javascripts/app/controllers/ticket_zoom.js.coffee

@@ -7,6 +7,7 @@ class App.TicketZoom extends App.Controller
   events:
     'click .js-submit':   'submit'
     'click .js-bookmark': 'bookmark'
+    'click .js-reset':    'reset'
 
   constructor: (params) ->
     super
@@ -287,184 +288,6 @@ class App.TicketZoom extends App.Controller
         ui:         @
       )
 
-      editTicket = (el) =>
-        el.append('<form class="edit"></form>')
-        @editEl = el
-
-        reset = (e) =>
-          e.preventDefault()
-          @taskReset()
-          show(@ticket)
-          new Edit(
-            ticket:     @ticket
-            el:         @el.find('.ticket-edit')
-            #el:         @el.find('.edit')
-            form_meta:  @form_meta
-            form_id:    @form_id
-            defaults:   @taskGet('article')
-            ui:         @
-          )
-
-        show = (ticket) =>
-          el.find('.edit').html('')
-
-          defaults   = ticket.attributes()
-          task_state = @taskGet('ticket')
-          modelDiff  = App.Utils.formDiff( task_state, defaults )
-          #if @isRole('Customer')
-          #  delete defaults['state_id']
-          #  delete defaults['state']
-          if !_.isEmpty( task_state )
-            defaults = _.extend( defaults, task_state )
-
-          new App.ControllerForm(
-            el:       el.find('.edit')
-            model:    App.Ticket
-            screen:   'edit'
-            params:   App.Ticket.find(ticket.id)
-            handlers: [
-              @ticketFormChanges
-            ]
-            filter:    @form_meta.filter
-            params:    defaults
-            #bookmarkable: true
-          )
-          #console.log('Ichanges', modelDiff, task_state, ticket.attributes())
-          #@markFormDiff( modelDiff )
-
-          # bind on reset link
-          @$('.js-reset').on(
-            'click'
-            (e) =>
-              reset(e)
-          )
-
-        @subscribeIdEdit = @ticket.subscribe(show)
-        show(@ticket)
-
-        if !@isRole('Customer')
-          el.append('<div class="tags"></div>')
-          new App.WidgetTag(
-            el:          el.find('.tags')
-            object_type: 'Ticket'
-            object:      @ticket
-            tags:        @tags
-          )
-          el.append('<div class="links"></div>')
-          new App.WidgetLink(
-            el:          el.find('.links')
-            object_type: 'Ticket'
-            object:      @ticket
-            links:       @links
-          )
-
-      showTicketHistory = =>
-        new App.TicketHistory(
-          ticket_id: @ticket.id
-          container: @el.closest('.content')
-        )
-      showTicketMerge = =>
-        new App.TicketMerge(
-          ticket:    @ticket
-          task_key:  @task_key
-          container: @el.closest('.content')
-        )
-      changeCustomer = (e, el) =>
-        new App.TicketCustomer(
-          ticket:    @ticket
-          container: @el.closest('.content')
-        )
-      @sidebarItems = [
-        {
-          head:     'Ticket'
-          name:     'ticket'
-          icon:     'message'
-          callback: editTicket
-        }
-      ]
-      if !@isRole('Customer')
-        @sidebarItems[0]['actions'] = [
-          {
-            name:     'ticket-history'
-            title:    'History'
-            callback: showTicketHistory
-          },
-          {
-            name:     'ticket-merge'
-            title:    'Merge'
-            callback: showTicketMerge
-          },
-          {
-            title:    'Change Customer'
-            name:     'customer-change'
-            callback: changeCustomer
-          },
-        ]
-      if !@isRole('Customer')
-        editCustomer = (e, el) =>
-          new App.ControllerGenericEdit(
-            id: @ticket.customer_id
-            genericObject: 'User'
-            screen: 'edit'
-            pageData:
-              title:   'Users'
-              object:  'User'
-              objects: 'Users'
-            container: @el.closest('.content')
-          )
-        showCustomer = (el) =>
-          new App.WidgetUser(
-            el:       el
-            user_id:  @ticket.customer_id
-          )
-        @sidebarItems.push {
-          head:    'Customer'
-          name:    'customer'
-          icon:    'person'
-          actions: [
-            {
-              title:    'Change Customer'
-              name:     'customer-change'
-              callback: changeCustomer
-            },
-            {
-              title:    'Edit Customer'
-              name:     'customer-edit'
-              callback: editCustomer
-            },
-          ]
-          callback: showCustomer
-        }
-        if @ticket.organization_id
-          editOrganization = (e, el) =>
-            new App.ControllerGenericEdit(
-              id: @ticket.organization_id,
-              genericObject: 'Organization'
-              pageData:
-                title:   'Organizations'
-                object:  'Organization'
-                objects: 'Organizations'
-              container: @el.closest('.content')
-            )
-          showOrganization = (el) =>
-            new App.WidgetOrganization(
-              el:              el
-              organization_id: @ticket.organization_id
-            )
-          @sidebarItems.push {
-            head: 'Organization'
-            name: 'organization'
-            icon: 'group'
-            actions: [
-              {
-                title:    'Edit Organization'
-                name:     'organization-edit'
-                callback: editOrganization
-              },
-            ]
-            callback: showOrganization
-          }
-
     # rerender whole sidebar if customer or organization has changed
     if @ticketLastAttributes.customer_id isnt @ticket.customer_id || @ticketLastAttributes.organization_id isnt @ticket.organization_id
       new App.WidgetAvatar(
@@ -472,10 +295,15 @@ class App.TicketZoom extends App.Controller
         user_id:  @ticket.customer_id
         size:     50
       )
-      new App.Sidebar(
+      new TicketSidebar(
         el:           @el.find('.tabsSidebar')
         sidebarState: @sidebarState
-        items:        @sidebarItems
+        ticket:       @ticket
+        taskGet:      @taskGet
+        task_key:     @task_key
+        tags:         @tags
+        links:        @links
+        form_meta:    @form_meta
       )
 
     # show article
@@ -744,7 +572,7 @@ class App.TicketZoom extends App.Controller
         ticket.article = undefined
 
         # reset form after save
-        @taskReset()
+        @reset()
 
         App.TaskManager.mute( @task_key )
 
@@ -754,6 +582,22 @@ class App.TicketZoom extends App.Controller
   bookmark: (e) =>
     $(e.currentTarget).find('.bookmark.icon').toggleClass('filled')
 
+  reset: (e) =>
+    if e
+      e.preventDefault()
+
+    # reset task
+    @taskReset()
+
+    # reset edit ticket / reset new article
+    App.Event.trigger('ui::ticket::taskReset', { ticket_id: @ticket.id } )
+
+    # hide reset button
+    @$('.js-reset').addClass('hide')
+
+    # remove change flag on tab
+    @$('.tabsSidebar-tab[data-tab="ticket"]').removeClass('is-changed')
+
   taskGet: (area) =>
     return {} if !App.TaskManager.get(@task_key)
     @localTaskData = App.TaskManager.get(@task_key).state || {}
@@ -773,25 +617,190 @@ class App.TicketZoom extends App.Controller
     @localTaskData = data
     App.TaskManager.update( @task_key, { 'state': @localTaskData })
 
-  taskReset: =>
-
-    # hide reset button
-    @$('.js-reset').addClass('hide')
-
-    # remove change flag on tab
-    @$('.tabsSidebar-tab[data-tab="ticket"]').removeClass('is-changed')
-
   # reset task state
+  taskReset: =>
     @localTaskData =
       ticket:  {}
       article: {}
     App.TaskManager.update( @task_key, { 'state': @localTaskData })
 
+class TicketSidebar extends App.Controller
+  constructor: ->
+    super
+    ticket       = App.Ticket.fullLocal( @ticket.id )
+    @subscribeId = ticket.subscribe(@render)
+    @render(ticket)
+
+  release: =>
+    App.Ticket.unsubscribe( @subscribeId )
+
+  render: (ticket) =>
+
+    editTicket = (el) =>
+      el.append('<form class="edit"></form>')
+      @editEl = el
+
+      show = (ticket) =>
+        el.find('.edit').html('')
+
+        defaults   = ticket.attributes()
+        task_state = @taskGet('ticket')
+        modelDiff  = App.Utils.formDiff( task_state, defaults )
+        #if @isRole('Customer')
+        #  delete defaults['state_id']
+        #  delete defaults['state']
+        if !_.isEmpty( task_state )
+          defaults = _.extend( defaults, task_state )
+
+        new App.ControllerForm(
+          el:       el.find('.edit')
+          model:    App.Ticket
+          screen:   'edit'
+          params:   App.Ticket.find(ticket.id)
+          handlers: [
+            @ticketFormChanges
+          ]
+          filter:    @form_meta.filter
+          params:    defaults
+          #bookmarkable: true
+        )
+        #console.log('Ichanges', modelDiff, task_state, ticket.attributes())
+        #@markFormDiff( modelDiff )
+
+      show(ticket)
       @bind(
         'ui::ticket::taskReset'
         (data) =>
-      if data.ticket_id is @ticket.id
+          if data.ticket_id is ticket.id
-        @taskReset()
+            show(ticket)
+      )
+
+      if !@isRole('Customer')
+        el.append('<div class="tags"></div>')
+        new App.WidgetTag(
+          el:          el.find('.tags')
+          object_type: 'Ticket'
+          object:      ticket
+          tags:        @tags
+        )
+        el.append('<div class="links"></div>')
+        new App.WidgetLink(
+          el:          el.find('.links')
+          object_type: 'Ticket'
+          object:      ticket
+          links:       @links
+        )
+
+    showTicketHistory = =>
+      new App.TicketHistory(
+        ticket_id: ticket.id
+        container: @el.closest('.content')
+      )
+    showTicketMerge = =>
+      new App.TicketMerge(
+        ticket:    ticket
+        task_key:  @task_key
+        container: @el.closest('.content')
+      )
+    changeCustomer = (e, el) =>
+      new App.TicketCustomer(
+        ticket:    ticket
+        container: @el.closest('.content')
+      )
+    @sidebarItems = [
+      {
+        head:     'Ticket'
+        name:     'ticket'
+        icon:     'message'
+        callback: editTicket
+      }
+    ]
+    if !@isRole('Customer')
+      @sidebarItems[0]['actions'] = [
+        {
+          name:     'ticket-history'
+          title:    'History'
+          callback: showTicketHistory
+        },
+        {
+          name:     'ticket-merge'
+          title:    'Merge'
+          callback: showTicketMerge
+        },
+        {
+          title:    'Change Customer'
+          name:     'customer-change'
+          callback: changeCustomer
+        },
+      ]
+    if !@isRole('Customer')
+      editCustomer = (e, el) =>
+        new App.ControllerGenericEdit(
+          id: ticket.customer_id
+          genericObject: 'User'
+          screen: 'edit'
+          pageData:
+            title:   'Users'
+            object:  'User'
+            objects: 'Users'
+          container: @el.closest('.content')
+        )
+      showCustomer = (el) =>
+        new App.WidgetUser(
+          el:       el
+          user_id:  ticket.customer_id
+        )
+      @sidebarItems.push {
+        head:    'Customer'
+        name:    'customer'
+        icon:    'person'
+        actions: [
+          {
+            title:    'Change Customer'
+            name:     'customer-change'
+            callback: changeCustomer
+          },
+          {
+            title:    'Edit Customer'
+            name:     'customer-edit'
+            callback: editCustomer
+          },
+        ]
+        callback: showCustomer
+      }
+      if ticket.organization_id
+        editOrganization = (e, el) =>
+          new App.ControllerGenericEdit(
+            id: ticket.organization_id,
+            genericObject: 'Organization'
+            pageData:
+              title:   'Organizations'
+              object:  'Organization'
+              objects: 'Organizations'
+            container: @el.closest('.content')
+          )
+        showOrganization = (el) =>
+          new App.WidgetOrganization(
+            el:              el
+            organization_id: ticket.organization_id
+          )
+        @sidebarItems.push {
+          head: 'Organization'
+          name: 'organization'
+          icon: 'group'
+          actions: [
+            {
+              title:    'Edit Organization'
+              name:     'organization-edit'
+              callback: editOrganization
+            },
+          ]
+          callback: showOrganization
+        }
+    new App.Sidebar(
+      el:           @el
+      sidebarState: @sidebarState
+      items:        @sidebarItems
     )
 
 class TicketTitle extends App.Controller
@@ -954,8 +963,6 @@ class Edit extends App.Controller
     #'.recipient-list .list-arrow':       'recipientListArrow'
 
   events:
-    #'click .submit':              'update'
-    'click [data-type="reset"]':   'reset'
     'click .visibility-toggle':    'toggleVisibility'
     'click .pop-selectable':       'selectArticleType'
     'click .pop-selected':         'showSelectableArticleType'
@@ -1016,7 +1023,6 @@ class Edit extends App.Controller
       open:   148
       closed: 20
 
-
     @dragEventCounter = 0
     @attachments      = []
 
@@ -1042,6 +1048,13 @@ class Edit extends App.Controller
           @setArticleType( 'email' )
     )
 
+    @bind(
+      'ui::ticket::taskReset'
+      (data) =>
+        if data.ticket_id is @ticket.id
+          @render()
+    )
+
   isIE10: ->
     Function('/*@cc_on return document.documentMode===10@*/')()
 
@@ -1428,15 +1441,6 @@ class Edit extends App.Controller
           element.empty()
     )
 
-  reset: (e) =>
-    e.preventDefault()
-
-    # reset task
-    App.Event.trigger('ui::ticket::taskReset', { ticket_id: @ticket.id } )
-
-    # rerender edit area
-    @render()
-
 class ArticleView extends App.Controller
   constructor: ->
     super

test/browser/agent_ticket_actions_level6_test.rb

@@ -17,7 +17,7 @@ class AgentTicketActionLevel6Test < TestCase
     #
 
     # create new ticket with no attachment, attachment check should pop up
-    ticket1 = ticket_create(
+    ticket_create(
       :data => {
         :customer => 'nico',
         :group    => 'Users',
@@ -50,8 +50,8 @@ class AgentTicketActionLevel6Test < TestCase
 
     # check if ticket is shown
     location_check( :url => '#ticket/zoom/' )
-
+    sleep 2
-
+    ticket_number = @browser.find_elements( { :css => '.active .page-header .ticket-number' } )[0].text
 
     #
     # attachment checks - update ticket
@@ -112,24 +112,90 @@ class AgentTicketActionLevel6Test < TestCase
     # ticket customer change checks
     #
 
-    # update customer, check if new customer is shown in side bar
+    # use current session
+    browser1 = @browser
 
+    browser2 = browser_instance
+    login(
+      :browser  => browser2,
+      :username => 'master@example.com',
+      :password => 'test',
+      :url      => browser_url,
+    )
+    tasks_close_all(
+      :browser => browser2,
+    )
+    random     = 'ticket-actions-6-test-' + rand(999999).to_s
+    user_email = random + '@example.com'
+    user_create(
+      :browser => browser2,
+      :data => {
+        :firstname => 'Action6 Firstname' + random,
+        :lastname  => 'Action6 Lastname' + random,
+        :email     => user_email,
+        :password  => 'some-pass',
+      },
+    )
+
+    # update customer, check if new customer is shown in side bar
+    ticket_open_by_search(
+      :browser => browser2,
+      :number  => ticket_number,
+    )
+    ticket_update(
+      :browser => browser2,
+      :data => {
+        :customer => user_email,
+      },
+      :do_not_submit => true,
+    )
 
     # check if customer has changed in second browser
+    click( :browser => browser1, :css => '.active .tabsSidebar-tab[data-tab="customer"]')
+    watch_for(
+      :browser => browser1,
+      :css     => '.active .tabsSidebar',
+      :value   => user_email,
+    )
 
+    #
+    # modify customer
+    #
+
+    # modify customer
+    click( :browser => browser1, :css => '.active .sidebar[data-tab="customer"] .js-actions .dropdown-toggle')
+    click( :browser => browser1, :css => '.active .sidebar[data-tab="customer"] .js-actions [data-type="customer-edit"]')
+    sleep 2
+    set( :browser => browser1, :css => '.modal [name="address"]', :value => 'some new address' )
+    click( :browser => browser1, :css => '.modal .js-submit')
+
+    # verify is customer has chnaged other browser too
+    click( :browser => browser2, :css => '.active .tabsSidebar-tab[data-tab="customer"]')
+    watch_for(
+      :browser => browser2,
+      :css     => '.active .sidebar[data-tab="customer"]',
+      :value   => 'some new address',
+    )
 
     #
     # ticket customer organization change checks
     #
 
     # change org of customer, check if org is shown in sidebar
-
+    click( :browser => browser1, :css => '.active .sidebar[data-tab="customer"] .js-actions .dropdown-toggle')
+    click( :browser => browser1, :css => '.active .sidebar[data-tab="customer"] .js-actions [data-type="customer-edit"]')
+    sleep 2
+    select( :browser => browser1, :css => '.modal [name="organization_id"]', :value => 'Zammad Foundation' )
+    click( :browser => browser1, :css => '.modal .js-submit')
 
     # check if org has changed in second browser
-
+    sleep 3
-
+    click( :browser => browser2, :css => '.active .tabsSidebar-tab[data-tab="organization"]')
-
+    watch_for(
-
+      :browser => browser2,
+      :css     => '.active .sidebar[data-tab="organization"]',
+      :value   => 'Zammad Foundation',
+    )
 
     #
     # form change/reset checks