vue/no-unused-properties does not process expressions like 'key' in $props in the template

[danyadev]

Checklist

• [x] I checked the FAQ.

Tell us about your environment

• ESLint version: 7.7.0
• eslint-plugin-vue version: 7.0.0-beta.2
• Node version: 14.7.0
• Operating System: Windows 10 Pro

Please show your full configuration:

{
  root: true,

  parserOptions: {
    sourceType: 'module',
    ecmaVersion: 2019
  },

  env: {
    browser: true,
    node: true,
    es2020: true
  },

  plugins: ['import'],

  settings: {
    'import/resolver': 'webpack',
    'import/ignore': []
  },

  extends: [
    'plugin:vue/vue3-recommended'
  ],

  rules: {
    'vue/no-unused-properties': ['error', {
      groups: ['props', 'setup']
    }]
  }
}

What did you do?

<template>
  <div class="modal_header">
    <div class="modal_header_title"><slot /></div>
    <div class="modal_header_buttons">
      <slot name="icons" />
      <CloseModal :closable="!('unclosable' in $props)" />
    </div>
  </div>
</template>

<script>
import CloseModal from './CloseModal.vue';

export default {
  props: ['unclosable'],

  components: {
    CloseModal
  }
};
</script>

What did you expect to happen? no errors

What actually happened?

C:\Users\danyadev\Desktop\vk-desktop\src\components\modals\ModalHeader.vue
  15:11  error  'unclosable' of property found, but never used  vue/no-unused-properties

Repository to reproduce this issue https://github.com/danyadev/vk-desktop/tree/dd32c02605830437374764751ee9e59b980360f2

[jacksongross]

I have a similar issue in that this rule doesn't pick up when props are spread into a component within the template of a SFC via v-bind="$props". It would be great if we could fix this rule as we can't enable it for props in our codebase without a fix for this issue.