Use fallback text for work package graph canvas

And use this text to do assertions in the spec file. It makes the canvas
more accessible while making its content testable.

frontend/src/app/shared/components/work-package-graphs/embedded/wp-embedded-graph.component.ts

@@ -128,6 +128,19 @@ export class WorkPackageEmbeddedGraphComponent {
     return this.chartType === 'horizontalBar' ? 'bar' : this.chartType;
   }
 
+  public get chartDescription():string {
+    const chartDataDescriptions = _.map(this.chartLabels, (label, index) => {
+      if (this.chartData.length === 1) {
+        const allCount = this.chartData[0].data[index];
+        return `${allCount} ${label}`;
+      }
+      const labelCounts = _.map(this.chartData, (dataset) => `${dataset.data[index]} ${dataset.label}`);
+      return `${label}: ${labelCounts.join(', ')}`;
+    });
+
+    return chartDataDescriptions.join('; ');
+  }
+
   private setHeight() {
     if (this.chartType === 'horizontalBar' && this.datasets && this.datasets[0]) {
       const labels:string[] = [];

frontend/src/app/shared/components/work-package-graphs/embedded/wp-embedded-graph.html

@@ -6,6 +6,7 @@
           [type]="mappedChartType"
           [options]="internalChartOptions"
           *ngIf="hasDataToDisplay">
+    {{chartDescription}}
   </canvas>
   <op-no-results *ngIf="!hasDataToDisplay && initialized"
               [title]="text.noResults">

spec/features/versions/graph_spec.rb

@@ -61,7 +61,7 @@ def expect_work_packages_visible_in_graph
     expect(page).to have_css(".work-packages-embedded-view--container", wait: 20)
     expect(page).to have_css(".op-wp-embeded-graph", visible: :all, wait: 20)
     canvas = find(".op-wp-embeded-graph canvas")
-    expect(canvas["ng-reflect-labels"]).to eq("Control,Subject under test")
+    expect(canvas.text).to eq("1 Control; 1 Subject under test")
   end
 
   context "for a version not shared" do