Fix unexpected due date tooltip for issues

app/assets/javascripts/sidebar/components/date/sidebar_date_widget.vue

@@ -237,13 +237,14 @@ export default {
     :data-testid="dataTestId"
     @open="openDatePicker"
   >
-    <template #title-extra>
+    <template v-if="canInherit" #title-extra>
       <gl-icon
         ref="epicDatePopover"
         name="question-o"
-        class="gl-ml-3 gl-cursor-pointer gl-text-blue-600"
+        class="gl-ml-3 gl-cursor-pointer gl-text-blue-600 hide-collapsed"
         tabindex="0"
         :aria-label="$options.i18n.help"
+        data-testid="inherit-date-popover"
       />
       <gl-popover
         :target="() => $refs.epicDatePopover.$el"

spec/frontend/sidebar/components/date/sidebar_date_widget_spec.js

@@ -22,6 +22,7 @@ describe('Sidebar date Widget', () => {
   const date = '2021-04-15';
 
   const findEditableItem = () => wrapper.findComponent(SidebarEditableItem);
+  const findPopoverIcon = () => wrapper.find('[data-testid="inherit-date-popover"]');
 
   const createComponent = ({
     dueDateQueryHandler = jest.fn().mockResolvedValue(issuableDueDateResponse()),
@@ -70,6 +71,12 @@ describe('Sidebar date Widget', () => {
     expect(wrapper.text()).toContain('Due date');
   });
 
+  it('does not display icon popover by default', () => {
+    createComponent();
+
+    expect(findPopoverIcon().exists()).toBe(false);
+  });
+
   describe('when issuable has no due date', () => {
     beforeEach(async () => {
       createComponent({
@@ -146,4 +153,10 @@ describe('Sidebar date Widget', () => {
       expect(wrapper.emitted(event)).toEqual([[date]]);
     },
   );
+
+  it('displays icon popover when issuable can inherit date', () => {
+    createComponent({ canInherit: true });
+
+    expect(findPopoverIcon().exists()).toBe(true);
+  });
 });