fix: Replace shadowroot querying with textInput reference. (#799)

* removed shadowRoot reference. * added ref to input Co-authored-by: Matt Driscoll <[email protected]>
Esri · Feb 4, 2020 · 5ee3f08 · 5ee3f08
1 parent a1e1e61
commit 5ee3f08
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/components/calcite-filter/calcite-filter.tsx b/src/components/calcite-filter/calcite-filter.tsx
@@ -42,6 +42,8 @@ export class CalciteFilter {
 
   @State() empty = true;
 
+  textInput: HTMLInputElement;
+
   // --------------------------------------------------------------------------
   //
   //  Events
@@ -97,7 +99,7 @@ export class CalciteFilter {
   };
 
   clear = (): void => {
-    this.el.shadowRoot.querySelector("input").value = "";
+    this.textInput.value = "";
     this.empty = true;
     this.calciteFilterChange.emit(this.data);
   };
@@ -118,6 +120,7 @@ export class CalciteFilter {
             placeholder={this.textPlaceholder}
             onInput={this.inputHandler}
             aria-label={this.textLabel || TEXT.filterLabel}
+            ref={(el) => (this.textInput = el as HTMLInputElement)}
           />
           <div class={CSS.searchIcon}>
             <calcite-icon scale="s" icon={ICONS.search} />