Update template, add itemWidth prop

ee/app/assets/javascripts/roadmap/components/epic_item.vue

@@ -24,12 +24,16 @@
         type: Number,
         required: true,
       },
+      itemWidth: {
+        type: Number,
+        required: true,
+      },
     },
   };
 </script>
 
 <template>
-  <tr class="epics-list-item">
+  <div class="epics-list-item clearfix">
     <epic-item-details
       :epic="epic"
       :current-group-id="currentGroupId"
@@ -41,6 +45,7 @@
       :timeframe-item="timeframeItem"
       :epic="epic"
       :shell-width="shellWidth"
+      :item-width="itemWidth"
     />
-  </tr>
+  </div>
 </template>

spec/javascripts/roadmap/components/epic_item_spec.js

@@ -3,13 +3,14 @@ import Vue from 'vue';
 import epicItemComponent from 'ee/roadmap/components/epic_item.vue';
 
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
-import { mockTimeframe, mockEpic, mockGroupId, mockShellWidth } from '../mock_data';
+import { mockTimeframe, mockEpic, mockGroupId, mockShellWidth, mockItemWidth } from '../mock_data';
 
 const createComponent = ({
   epic = mockEpic,
   timeframe = mockTimeframe,
   currentGroupId = mockGroupId,
   shellWidth = mockShellWidth,
+  itemWidth = mockItemWidth,
 }) => {
   const Component = Vue.extend(epicItemComponent);
 
@@ -18,6 +19,7 @@ const createComponent = ({
     timeframe,
     currentGroupId,
     shellWidth,
+    itemWidth,
   });
 };