[26086] Fix switching from timeline (#5848)

* [26086] Fix switching from timeline

https://community.openproject.com/wp/26086

* Add regression test


[ci skip]

frontend/app/components/wp-table/timeline/global-elements/wp-timeline-relations.directive.ts

@@ -108,10 +108,11 @@ export class WorkPackageTableTimelineRelations {
     // for all visible WorkPackage rows...
     Observable.combineLatest(
       this.states.table.renderedWorkPackages.values$(),
-      this.states.table.timelineVisible.values$().filter(v => v.visible)
+      this.states.table.timelineVisible.values$()
     )
+      .filter(([rendered, timeline]) => timeline.isVisible)
       .takeUntil(scopeDestroyed$(this.$scope))
-      .map(([rendered, visible]) => rendered)
+      .map(([rendered, _]) => rendered)
       .subscribe(list => {
         // ... make sure that the corresponding relations are loaded ...
         const wps = _.compact(list.map(row => row.workPackageId) as string[]);
@@ -220,8 +221,11 @@ export class WorkPackageTableTimelineRelations {
     startCell:WorkPackageTimelineCell,
     endCell:WorkPackageTimelineCell) {
 
+    const rowFrom = this.workPackageIdOrder[idxFrom];
+    const rowTo = this.workPackageIdOrder[idxTo];
+
     // If any of the targets are hidden in the table, skip
-    if (this.workPackageIdOrder[idxFrom].hidden || this.workPackageIdOrder[idxTo].hidden) {
+    if (!(rowFrom && rowTo) || (rowFrom.hidden || rowTo.hidden)) {
       return;
     }
 

frontend/app/templates/components/selectable_title.html

@@ -5,7 +5,9 @@
             target="wpQuerySelectService"
             collision-container="#content"
             locals="selectedTitle">
-        <accessible-by-keyboard link-title="{{ I18n.t('js.toolbar.search_query_title') }}" >
+        <accessible-by-keyboard
+                link-class="wp-table--query-menu-link"
+                link-title="{{ I18n.t('js.toolbar.search_query_title') }}" >
           <op-icon icon-classes="icon-pulldown icon-button icon-small hide-when-print"></op-icon>
           {{ selectedTitle | characters:50 }}
         </accessible-by-keyboard>

spec/features/work_packages/timeline/timeline_navigation_spec.rb

@@ -31,6 +31,7 @@ require 'spec_helper'
 RSpec.feature 'Work package timeline navigation', js: true, selenium: true do
   let(:user) { FactoryGirl.create(:admin) }
   let(:project) { FactoryGirl.create(:project) }
+  let(:query_menu) { Components::WorkPackages::QueryMenu.new }
   let(:wp_timeline) { Pages::WorkPackagesTimeline.new(project) }
   let(:settings_menu) { Components::WorkPackages::SettingsMenu.new }
 
@@ -46,6 +47,71 @@ RSpec.feature 'Work package timeline navigation', js: true, selenium: true do
     login_as(user)
   end
 
+  describe 'with multiple queries' do
+    let(:type) { FactoryGirl.create :type }
+    let(:type2) { FactoryGirl.create :type }
+    let(:project) { FactoryGirl.create(:project, types: [type, type2]) }
+
+    let!(:work_package) do
+      FactoryGirl.create :work_package,
+                         project: project,
+                         type: type
+    end
+
+    let!(:work_package2) do
+      FactoryGirl.create :work_package,
+                         project: project,
+                         type: type2
+    end
+
+
+    let!(:query) do
+      query              = FactoryGirl.build(:query, user: user, project: project)
+      query.column_names = ['id', 'type', 'subject']
+      query.filters.clear
+      query.timeline_visible = false
+      query.add_filter('type_id', '=', [type.id])
+      query.name = 'Query without Timeline'
+
+      query.save!
+      query
+    end
+
+    let!(:query_tl) do
+      query              = FactoryGirl.build(:query, user: user, project: project)
+      query.column_names = ['id', 'type', 'subject']
+      query.filters.clear
+      query.add_filter('type_id', '=', [type2.id])
+      query.timeline_visible = true
+      query.name = 'Query with Timeline'
+
+      query.save!
+      query
+    end
+
+    it 'can move from and to the timeline query (Regression test #26086)' do
+      # Visit timeline query
+      wp_timeline.visit_query query_tl
+
+      wp_timeline.expect_timeline!(open: true)
+      wp_timeline.expect_work_package_listed work_package2
+      wp_timeline.expect_work_package_not_listed work_package
+
+      # Select other query
+      query_menu.select query
+      wp_timeline.expect_timeline!(open: false)
+      wp_timeline.expect_work_package_listed work_package
+      wp_timeline.expect_work_package_not_listed work_package2
+
+      # Select first query again
+      query_menu.select query_tl
+
+      wp_timeline.expect_timeline!(open: true)
+      wp_timeline.expect_work_package_listed work_package2
+      wp_timeline.expect_work_package_not_listed work_package
+    end
+  end
+
   it 'can save the open state and zoom of timeline' do
     wp_timeline.visit!
     wp_timeline.expect_work_package_listed(work_package)
@@ -168,7 +234,6 @@ RSpec.feature 'Work package timeline navigation', js: true, selenium: true do
       wp_table.visit_query(query)
       wp_table.expect_work_package_listed(wp_cat1, wp_cat2, wp_none)
 
-      # Group by category
       wp_table.click_setting_item 'Group by ...'
       select 'Category', from: 'selected_columns_new'
       click_button 'Apply'
@@ -179,7 +244,7 @@ RSpec.feature 'Work package timeline navigation', js: true, selenium: true do
       # Expect timeline to have relation between first and second group
       wp_timeline.expect_timeline_relation(wp_cat1, wp_cat2)
 
-      # Collapse first section
+      # Collapse Foo section
       find('#wp-table-rowgroup-1 .expander').click
       wp_timeline.expect_work_package_not_listed(wp_cat1)
 

spec/support/components/work_packages/query_menu.rb

@@ -0,0 +1,54 @@
+#-- copyright
+# OpenProject is a project management system.
+# Copyright (C) 2012-2017 the OpenProject Foundation (OPF)
+#
+# This program is free software; you can redistribute it and/or
+# modify it under the terms of the GNU General Public License version 3.
+#
+# OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
+# Copyright (C) 2006-2017 Jean-Philippe Lang
+# Copyright (C) 2010-2013 the ChiliProject Team
+#
+# This program is free software; you can redistribute it and/or
+# modify it under the terms of the GNU General Public License
+# as published by the Free Software Foundation; either version 2
+# of the License, or (at your option) any later version.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU General Public License
+# along with this program; if not, write to the Free Software
+# Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+#
+# See doc/COPYRIGHT.rdoc for more details.
+#++
+
+module Components
+  module WorkPackages
+    class QueryMenu
+      include Capybara::DSL
+      include RSpec::Matchers
+
+      def select(query)
+        page.find(selector).click
+
+        page.fill_in 'query-title-filter', with: query.name
+
+        page.within(results_container) do
+          page.find('.ui-menu-item-wrapper', text: query.name).click
+        end
+      end
+
+      def selector
+        '.wp-table--query-menu-link'
+      end
+
+      def results_container
+        '.search-query-wrapper'
+      end
+    end
+  end
+end