Vue files: False positives

About

Quite a few strings are being correctly detected in the <script></script> section of .vue files, such as

 userImageAltDescription() {
      if (
        this.model &&
        this.model.last_deployment &&
        this.model.last_deployment.user &&
        this.model.last_deployment.user.username
      ) {
        return `${this.model.last_deployment.user.username}'s avatar'`; // should be exernalized
      }
      return '';
    },

I've noticed a few possible false positives though

Possible false positives

• app/assets/javascripts/diffs/components/commit_item.vue

...
authorUrl() {
  return this.author.web_url || `mailto:${this.commit.author_email}`; // false positive
}

• app/assets/javascripts/clusters/components/uninstall_application_button.vue

label() {
  return this.loading ? this.__('Uninstalling') : this.__('Uninstall'); // false positive
},

• app/assets/javascripts/environments/components/environment_item.vue

  /**
     * Verifies if the `last?` key is present and returns its value.
     *
     * @returns {Boolean|Undefined}
     */
    isLastDeployment() {
      return this.model && this.model.last_deployment && this.model.last_deployment['last?']; // the object key 'last?' looks like a false positive
    },

• app/assets/javascripts/ide/components/commit_sidebar/list_item.vue

  computed: {
    iconName() {
      const suffix = this.stagedList ? '-solid' : ''; // lint error here, but i think the iconName is only ever used for a css class down the line

      return `${getCommitIconMap(this.file).icon}${suffix}`;
    },
   ...
  }

• app/assets/javascripts/monitoring/components/charts/area.vue

    chartOptions() {
      return {
        xAxis: {
          name: 'Time', // false positive
          type: 'time',
          axisLabel: {
            formatter: date => dateFormat(date, 'h:MM TT'),
          },
          axisPointer: {
            snap: true,
          },
        },
        yAxis: {
          name: this.yAxisLabel,
          axisLabel: {
            formatter: num => roundOffFloat(num, 3).toString(),
          },
        },
        series: this.scatterSeries,
        dataZoom: this.dataZoomConfig,
      };
    },

• app/assets/javascripts/notebook/cells/markdown.vue

...
  if (typeof katex !== 'undefined') {
    const katexString = text
      .replace(/&/g, '&')
      .replace(/&=&/g, '\\space=\\space') // false positive
      .replace(/<(\/?)em>/g, '_');
...

• app/assets/javascripts/notebook/cells/output/image.vue

...
  computed: {
    imgSrc() {
      return `data:${this.outputType};base64,${this.rawCode}`; // false positive data image url
    },
    showOutput() {
      return this.index === 0;
    },
  },
...

• app/assets/javascripts/notebook/index.vue

  methods: {
    cellType(type) {
      return `${type}-cell`; // false positive
    },
  },

• app/assets/javascripts/sidebar/components/time_tracking/collapsed_state.vue

...
return sprintf('%{title}: %{text}', { title, text: this.text }); // should be an error, need to use __() with sprintf
...

• app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.vue

...
      this.service
        .removeSourceBranch()
        .then(res => res.data)
        .then(data => {
          if (data.message === 'Branch was deleted') { // Branch was deleted - false positive, looks to be data returned from an ajax request
            eventHub.$emit('MRWidgetUpdateRequested', () => {
              this.isMakingRequest = false;
            });
          }
        })
...

• app/assets/javascripts/vue_shared/components/changed_file_icon.vue

    changedIcon() {
      const suffix = !this.file.changed && this.file.staged && !this.showStagedIcon ? '-solid' : ''; // '-solid' false positive

• app/assets/javascripts/vue_shared/components/deprecated_modal.vue

    closeButtonLabel: {
      type: String,
      required: false,
      default: 'Cancel', // Seems like a valid case, but might be better as a warning
    },

• ee/app/assets/javascripts/design_management/pages/index.vue

      const optimisticResponse = Array.from(files).map(file => ({
        __typename: 'Design', // 'Design' is giving an error, but looks like its part of a graphql query
        id: -_.uniqueId(),
        image: '',
        filename: file.name,
        versions: {
          __typename: 'DesignVersionConnection',
          edges: {
            __typename: 'DesignVersionEdge',
            node: {
              __typename: 'DesignVersion',
              id: -_.uniqueId(),
              sha: -_.uniqueId(),
            },
          },
        },
      }));