}"
`;
+exports[`<script setup> ref sugar handle TS casting syntax 1`] = `
+"import { ref as _ref, defineComponent as _defineComponent } from 'vue'
+
+export default _defineComponent({
+ setup(__props, { expose }) {
+ expose()
+
+ let n = _ref<number | undefined>()
+ console.log(n.value!)
+ console.log(n.value as number)
+
+return { n }
+}
+
+})"
+`;
+
exports[`<script setup> ref sugar mixing $ref & $computed declarations 1`] = `
"import { ref as _ref, computed as _computed } from 'vue'
expect(content).not.toMatch('.value')
})
+ // #4254
+ test('handle TS casting syntax', () => {
+ const { content } = compile(
+ `
+ <script setup lang="ts">
+ let n = $ref<number | undefined>()
+ console.log(n!)
+ console.log(n as number)
+ </script>`,
+ {
+ refSugar: true
+ }
+ )
+ assertCode(content)
+ expect(content).toMatch('console.log(n.value!)')
+ expect(content).toMatch('console.log(n.value as number)')
+ })
+
describe('errors', () => {
test('non-let $ref declaration', () => {
expect(() =>
;(walk as any)(root, {
enter(node: Node & { scopeIds?: Set<string> }, parent: Node | undefined) {
parent && parentStack.push(parent)
- if (node.type.startsWith('TS')) {
+ if (
+ parent &&
+ parent.type.startsWith('TS') &&
+ parent.type !== 'TSAsExpression' &&
+ parent.type !== 'TSNonNullExpression'
+ ) {
return this.skip()
}
if (onNode && onNode(node, parent!, parentStack) === false) {