Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] Typescript typings #696

Open
Indeedornot opened this issue Mar 3, 2024 · 1 comment
Open

[BUG] Typescript typings #696

Indeedornot opened this issue Mar 3, 2024 · 1 comment

Comments

@Indeedornot
Copy link

Indeedornot commented Mar 3, 2024

🐛 Bug description

I'll use this issue to report multiple issues I have found while working with the plugin

  • Lack of typing for vModel
      {/* vModel property is not known - but works */}
      <LogMessages
        vModel={toLog.value}
        // v-model={toLog.value} - works, untyped due to it being looked up on intrinsic attributes and it having a fallthrough case
      />

      {/* Works and is typed */}
      <LogMessages
        onUpdate:modelValue={(e) => (toLog.value = e)}
        modelValue={toLog.value}
      />
  • resolveTypes does not generate typed emits
      {/* Event type is not resolved */}
      <LogInput onLog={(msg) => log(msg)} />

const LogInput = defineComponent(
  (_,
    { emit }: SetupContext<{ log: (msg: string) => void }>// : { emit: { log: (msg: string) => void } } - no difference in typing
  ) => {
    const input = ref('')
    const log = (msg: string) => emit('log', msg);
    return () => (
      <div>
        <input
          vModel={input.value}
          onKeydown={(e) => {
            if (e.key !== 'Enter') return;
            log(input.value);
            input.value = '';
          }}
        />
      </div>
    );
  }
  // #Works with such declaration:
  // {
  //   emits: {
  //     log: (msg: string) => true
  //   }
  // }
  // #Does not work with runtime and resolveTypes
)

used jsx-explorer to check code

  • 'class', 'style' and other passthrough attributes are throwing error even with 'inheritAttrs': true
      <LogMessages
        //class is not found throwing an error
        class=""
      />

    inheritAttrs: true

📝 Steps to reproduce

Create a new tsx repository using create-vue

Reproduction Link: Reproduction

🏞 Desired result

  • Typed vModel based on checking 'onUpdate:modelValue' and 'modelValue' props (and other names)
  • Proper resolving emits type
  • Proper inheritAttrs typing or allowing passthrough of attributes like onClick, class, style and similiar

🚑 Other information

@Indeedornot
Copy link
Author

After diving deeper into this issue it appears to be a connection of problems between two repositories
Language Tools And this one
There would be need to add a resolver for defineComponent for types including the resolveTypes and vModel

Should this issue be moved to Language Tools repository?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant