diff --git a/src/data-table/__tests__/highlight-cell-text.test.tsx b/src/data-table/__tests__/highlight-cell-text.test.tsx
new file mode 100644
index 0000000000..0529811c3d
--- /dev/null
+++ b/src/data-table/__tests__/highlight-cell-text.test.tsx
@@ -0,0 +1,22 @@
+/*
+Copyright (c) Uber Technologies, Inc.
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+*/
+import React from 'react';
+import { render } from '@testing-library/react';
+
+import { HighlightCellText } from '../text-search';
+
+describe('HighlightCellText', () => {
+  it('renders the text value when there is no active query', () => {
+    const { container } = render(<HighlightCellText text="hello world" query="" />);
+    expect(container.textContent).toBe('hello world');
+  });
+
+  it('renders the text value with the matching segment highlighted', () => {
+    const { container } = render(<HighlightCellText text="hello world" query="world" />);
+    expect(container.textContent).toBe('hello world');
+  });
+});
diff --git a/src/data-table/text-search.tsx b/src/data-table/text-search.tsx
index 53b8a8c172..9eb1c83c62 100644
--- a/src/data-table/text-search.tsx
+++ b/src/data-table/text-search.tsx
@@ -48,7 +48,7 @@ export const HighlightCellText: React.FC<{ text: string; query: string }> = (pro
   const [css, theme] = useStyletron();
 
   if (!props.query) {
-    return <>props.text</>;
+    return <>{props.text}</>;
   }
 
   return (