Merge pull request #8264 from opf/fix/32983/filtered-wp-table

[32983] Ensure wp-embedded-table-entry does not get bootstrapped twice

frontend/src/app/components/wp-table/embedded/embedded-tables-macro.component.ts

@@ -29,10 +29,10 @@
 import {Component, ElementRef} from "@angular/core";
 import {WorkPackageTableConfigurationObject} from "core-components/wp-table/wp-table-configuration";
 
-export const wpEmbeddedTableEntrySelector = 'macro.embedded-table';
+export const wpEmbeddedTableMacroSelector = 'macro.embedded-table';
 
 @Component({
-  selector: wpEmbeddedTableEntrySelector,
+  selector: wpEmbeddedTableMacroSelector,
   template: `
     <wp-embedded-table-entry [queryProps]="queryProps"
                              [configuration]="configuration">

frontend/src/app/components/wp-table/embedded/wp-embedded-base.component.ts

@@ -37,12 +37,12 @@ export abstract class WorkPackageEmbeddedBaseComponent extends WorkPackagesViewB
   @InjectField() cdRef:ChangeDetectorRef;
 
   ngOnInit() {
-    super.ngOnInit();
-
     this.configuration = new WorkPackageTableConfiguration(this.providedConfiguration);
     // Set embedded status in configuration
     this.configuration.isEmbedded = true;
     this.initialized = true;
+
+    super.ngOnInit();
   }
 
   ngAfterViewInit():void {

frontend/src/app/components/wp-table/embedded/wp-embedded-table.html

@@ -1,4 +1,5 @@
-<div class="work-packages-embedded-view--container loading-indicator--location"
+<div *ngIf="configuration"
+     class="work-packages-embedded-view--container loading-indicator--location"
      [ngClass]="{ '-hierarchy-disabled': !configuration.hierarchyToggleEnabled,
                   '-compact-tables': configuration.compactTableStyle,
                   '-external-height': externalHeight }"

frontend/src/app/global-dynamic-components.const.ts

@@ -2,7 +2,7 @@ import {OptionalBootstrapDefinition} from "core-app/globals/dynamic-bootstrapper
 import {appBaseSelector, ApplicationBaseComponent} from "core-app/modules/router/base/application-base.component";
 import {
   EmbeddedTablesMacroComponent,
-  wpEmbeddedTableEntrySelector
+  wpEmbeddedTableMacroSelector
 } from "core-components/wp-table/embedded/embedded-tables-macro.component";
 import {
   ColorsAutocompleter,
@@ -100,7 +100,6 @@ import {
   RemoteFieldUpdaterComponent,
   remoteFieldUpdaterSelector
 } from "core-app/modules/common/remote-field-updater/remote-field-updater.component";
-import {WorkPackageEmbeddedTableEntryComponent} from "core-components/wp-table/embedded/wp-embedded-table-entry.component";
 import {
   WorkPackageOverviewGraphComponent,
   wpOverviewGraphSelector
@@ -135,9 +134,8 @@ import {
 export const globalDynamicComponents:OptionalBootstrapDefinition[] = [
   { selector: appBaseSelector, cls: ApplicationBaseComponent },
   { selector: attributeHelpTextSelector, cls: AttributeHelpTextComponent },
-  { selector: wpEmbeddedTableEntrySelector, cls: EmbeddedTablesMacroComponent, embeddable: true },
+  { selector: wpEmbeddedTableMacroSelector, cls: EmbeddedTablesMacroComponent, embeddable: true },
   { selector: colorsAutocompleterSelector, cls: ColorsAutocompleter },
-  { selector: wpEmbeddedTableEntrySelector, cls: EmbeddedTablesMacroComponent, embeddable: true },
   { selector: zenModeComponentSelector, cls: ZenModeButtonComponent },
   { selector: attachmentsSelector, cls: AttachmentsComponent, embeddable: true },
   { selector: usersAutocompleterSelector, cls: UserAutocompleterComponent },
@@ -170,7 +168,6 @@ export const globalDynamicComponents:OptionalBootstrapDefinition[] = [
   { selector: enterpriseActiveSavedTrialSelector, cls: EEActiveSavedTrialComponent },
   { selector: projectMenuAutocompleteSelector, cls: ProjectMenuAutocompleteComponent },
   { selector: remoteFieldUpdaterSelector, cls: RemoteFieldUpdaterComponent },
-  { selector: wpEmbeddedTableEntrySelector, cls: WorkPackageEmbeddedTableEntryComponent },
   { selector: wpOverviewGraphSelector, cls: WorkPackageOverviewGraphComponent },
   { selector: wpQuerySelectSelector, cls: WorkPackageQuerySelectDropdownComponent },
 ];

spec/features/wysiwyg/macros/embedded_tables_spec.rb

@@ -32,9 +32,12 @@ describe 'Wysiwyg embedded work package tables',
          type: :feature, js: true do
   using_shared_fixtures :admin
   let(:user) { admin }
-  let(:project) { FactoryBot.create(:project, enabled_module_names: %w[wiki work_package_tracking]) }
+  let(:type_task) { FactoryBot.create :type_task }
+  let(:type_bug) { FactoryBot.create :type_bug }
+  let(:project) { FactoryBot.create(:project, types: [type_task, type_bug], enabled_module_names: %w[wiki work_package_tracking]) }
   let(:editor) { ::Components::WysiwygEditor.new }
-  let!(:work_package) { FactoryBot.create(:work_package, project: project) }
+  let!(:wp_task) { FactoryBot.create(:work_package, project: project, type: type_task) }
+  let!(:wp_bug) { FactoryBot.create(:work_package, project: project, type: type_bug) }
 
   let(:modal) { ::Components::WorkPackages::TableConfigurationModal.new }
   let(:filters) { ::Components::WorkPackages::TableConfiguration::Filters.new }
@@ -57,7 +60,7 @@ describe 'Wysiwyg embedded work package tables',
           modal.expect_open
           modal.switch_to 'Filters'
           filters.expect_filter_count 2
-          filters.add_filter_by('Type', 'is', work_package.type.name)
+          filters.add_filter_by('Type', 'is', type_task.name)
 
           modal.switch_to 'Columns'
           columns.assume_opened
@@ -92,7 +95,8 @@ describe 'Wysiwyg embedded work package tables',
           # Expect we can preview the table within ckeditor
           editor.within_enabled_preview do |preview_container|
             embedded_table = ::Pages::EmbeddedWorkPackagesTable.new preview_container
-            embedded_table.expect_work_package_listed work_package
+            embedded_table.expect_work_package_listed wp_task
+            embedded_table.ensure_work_package_not_listed! wp_bug
           end
         end
 
@@ -102,10 +106,11 @@ describe 'Wysiwyg embedded work package tables',
         expect(page).to have_selector('.flash.notice')
 
         embedded_table = ::Pages::EmbeddedWorkPackagesTable.new find('.wiki-content')
-        embedded_table.expect_work_package_listed work_package
+        embedded_table.expect_work_package_listed wp_task
+        embedded_table.ensure_work_package_not_listed! wp_bug
 
         # Clicking on work package ID redirects
-        full_view = embedded_table.open_full_screen_by_doubleclick work_package
+        full_view = embedded_table.open_full_screen_by_doubleclick wp_task
         full_view.ensure_page_loaded
       end
     end