{"record":{"id":"2a47b75cab84b380","repo":"oxc-project/oxc","slug":"unexpected-in-computed-property","errorCode":null,"errorMessage":"Unexpected {} in \"{}\" computed property.","messagePattern":"Unexpected (.+?) in \"(.+?)\" computed property\\.","errorType":"validation","errorClass":"OxcDiagnostic","httpStatus":null,"severity":"error","filePath":"crates/oxc_linter/src/rules/vue/no_async_in_computed_properties.rs","lineNumber":42,"sourceCode":"    NewPromise,\n    Asynchronous,\n    Timed,\n}\n\nimpl AsyncKind {\n    fn as_str(self) -> &'static str {\n        match self {\n            Self::AsyncFunction => \"async function declaration\",\n            Self::Await => \"await operator\",\n            Self::NewPromise => \"Promise object\",\n            Self::Asynchronous => \"asynchronous action\",\n            Self::Timed => \"timed function\",\n        }\n    }\n}\n\nfn unexpected_in_property(span: Span, kind: AsyncKind, key: &str) -> OxcDiagnostic {\n    OxcDiagnostic::warn(format!(\"Unexpected {} in \\\"{}\\\" computed property.\", kind.as_str(), key))\n        .with_label(span)\n}\n\nfn unexpected_in_function(span: Span, kind: AsyncKind) -> OxcDiagnostic {\n    OxcDiagnostic::warn(format!(\"Unexpected {} in computed function.\", kind.as_str()))\n        .with_label(span)\n}\n\n#[derive(Debug, Default, Clone, Serialize, Deserialize, JsonSchema)]\n#[serde(rename_all = \"camelCase\", default, deny_unknown_fields)]\nstruct NoAsyncInComputedPropertiesConfig {\n    /// Names of identifiers whose member-call chains (`.then` / `.catch` / `.finally`)\n    /// should be ignored. Useful for libraries like Zod where `.catch(default)` is\n    /// a builder API, not a Promise method.\n    ignored_object_names: FxHashSet<String>,\n}\n\n#[derive(Debug, Default, Clone, Deserialize, Serialize, JsonSchema)]","sourceCodeStart":24,"sourceCodeEnd":60,"githubUrl":"https://github.com/oxc-project/oxc/blob/e1e7af627c8843ab64044ed466b128fcc21a035b/crates/oxc_linter/src/rules/vue/no_async_in_computed_properties.rs#L24-L60","documentation":"Diagnostic from oxlint's vue/no-async-in-computed-properties rule (since oxlint 1.71.0). It fires when a computed property (object entry under `computed`) contains asynchronous work: an async function declaration, an await operator, a Promise object, a .then/.catch/.finally chain, or a timed function like setTimeout. Vue computed properties must be synchronous; async ones return a Promise that never updates reactively, producing values that render as empty or stale forever.","triggerScenarios":"`computed: { foo: async function() {...} }`, a computed whose body contains `await`, `new Promise(...)`, `someCall().then(...)`, or setTimeout/setInterval, where the object is a Vue component options object.","commonSituations":"Loading data inside computed because it 'derives' from props; chaining a Promise-returning API in a getter; accidentally flagging builder APIs like Zod's .catch() — the rule's ignoredObjectNames config (ignored_object_names) exists exactly to whitelist those.","solutions":["Move the async work into a method, watch/watchEffect, or onMounted and store the result in a ref/data property","Keep the computed synchronous and derive from already-loaded state","If the flagged member chain is a builder API (e.g., zod's .catch), add the object name to ignoredObjectNames: { \"ignoredObjectNames\": [\"z\"] }"],"exampleFix":"// before\ncomputed: {\n  async user() { return await fetchUser(this.id) },\n}\n// after\ndata: () => ({ user: null }),\nwatch: {\n  id: {\n    immediate: true,\n    async handler(id) { this.user = await fetchUser(id) },\n  },\n}","handlingStrategy":"validation","validationCode":"# scan computed blocks for async constructs\ngrep -rnA20 \"computed: *{\" --include='*.vue' src | grep -nE \"async |await |\\.then\\(|new Promise|setTimeout\"","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Keep computed properties pure and synchronous by convention; do async work in watch/watchEffect/lifecycle hooks","Configure ignoredObjectNames for fluent builder APIs (zod .catch) to avoid false positives","Enable this rule before code review so async computed never lands"],"tags":["vue","oxlint","lint","computed","async","reactivity"],"backgroundTag":"async-in-vue-computed","analyzedSha":"e1e7af627c8843ab64044ed466b128fcc21a035b","analyzedAt":"2026-08-20T07:01:07.079Z","contentChangedAt":"2026-08-20T07:01:07.079Z","schemaVersion":2},"datasetVersion":"2026-09-14T05:17:10.506Z"}