diff --git a/src/components/ha-service-control.ts b/src/components/ha-service-control.ts
index 48fb03011e..8fab54997b 100644
--- a/src/components/ha-service-control.ts
+++ b/src/components/ha-service-control.ts
@@ -1,5 +1,9 @@
 import { mdiHelpCircle } from "@mdi/js";
-import { HassService, HassServiceTarget } from "home-assistant-js-websocket";
+import {
+  HassService,
+  HassServices,
+  HassServiceTarget,
+} from "home-assistant-js-websocket";
 import {
   css,
   CSSResult,
@@ -73,7 +77,10 @@ export class HaServiceControl extends LitElement {
       this._checkedKeys = new Set();
     }
 
-    const serviceData = this._getServiceInfo(this.value?.service);
+    const serviceData = this._getServiceInfo(
+      this.value?.service,
+      this.hass.services
+    );
 
     if (
       serviceData &&
@@ -122,40 +129,45 @@ export class HaServiceControl extends LitElement {
     return ENTITY_COMPONENT_DOMAINS.includes(domain) ? [domain] : null;
   });
 
-  private _getServiceInfo = memoizeOne((service?: string):
-    | ExtHassService
-    | undefined => {
-    if (!service) {
-      return undefined;
-    }
-    const domain = computeDomain(service);
-    const serviceName = computeObjectId(service);
-    const serviceDomains = this.hass.services;
-    if (!(domain in serviceDomains)) {
-      return undefined;
-    }
-    if (!(serviceName in serviceDomains[domain])) {
-      return undefined;
-    }
+  private _getServiceInfo = memoizeOne(
+    (
+      service?: string,
+      serviceDomains?: HassServices
+    ): ExtHassService | undefined => {
+      if (!service || !serviceDomains) {
+        return undefined;
+      }
+      const domain = computeDomain(service);
+      const serviceName = computeObjectId(service);
+      if (!(domain in serviceDomains)) {
+        return undefined;
+      }
+      if (!(serviceName in serviceDomains[domain])) {
+        return undefined;
+      }
 
-    const fields = Object.entries(
-      serviceDomains[domain][serviceName].fields
-    ).map(([key, value]) => ({
-      key,
-      ...value,
-      selector: value.selector as Selector | undefined,
-    }));
-    return {
-      ...serviceDomains[domain][serviceName],
-      fields,
-      hasSelector: fields.length
-        ? fields.filter((field) => field.selector).map((field) => field.key)
-        : [],
-    };
-  });
+      const fields = Object.entries(
+        serviceDomains[domain][serviceName].fields
+      ).map(([key, value]) => ({
+        key,
+        ...value,
+        selector: value.selector as Selector | undefined,
+      }));
+      return {
+        ...serviceDomains[domain][serviceName],
+        fields,
+        hasSelector: fields.length
+          ? fields.filter((field) => field.selector).map((field) => field.key)
+          : [],
+      };
+    }
+  );
 
   protected render() {
-    const serviceData = this._getServiceInfo(this._value?.service);
+    const serviceData = this._getServiceInfo(
+      this._value?.service,
+      this.hass.services
+    );
 
     const shouldRenderServiceDataYaml =
       (serviceData?.fields.length && !serviceData.hasSelector.length) ||