diff --git a/__mocks__/marked/marked.js b/__mocks__/marked/marked.js
new file mode 100644
index 0000000..76d7dd0
--- /dev/null
+++ b/__mocks__/marked/marked.js
@@ -0,0 +1,3 @@
+import marked from "marked";
+jest.genMockFromModule(marked);
+module.exports = marked;
diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index b1c1863..ed4efe6 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -104,7 +104,7 @@ export const FileUpload: React.FC<IFileUpload> = ({
             </div>
           );
         })}
-        <div className={classes.box} {...getRootProps({ isDragActive: true })}>
+        <div className={classes.box} {...getRootProps()}>
           <input {...getInputProps()} />
           <p>{stateText}</p>
         </div>
diff --git a/src/components/Text.tsx b/src/components/Text.tsx
index 7e3f49c..11cd68d 100644
--- a/src/components/Text.tsx
+++ b/src/components/Text.tsx
@@ -66,12 +66,13 @@ export const Text: React.FC<IText> = ({
           {title}
         </Typography>
         <Box mb={3} maxWidth={600}>
-          {label && <InputLabel>{label}</InputLabel>}
+          {label && <InputLabel htmlFor={name}>{label}</InputLabel>}
           <Input
             placeholder={placeholder}
             fullWidth={fullWidth}
             multiline={multiline}
             name={name}
+            id={name}
             type={type}
             onChange={e => {
               if (maxWords) {
@@ -91,7 +92,12 @@ export const Text: React.FC<IText> = ({
               pt={1}
               textAlign="right"
             >
-              <span>{diff >= 0 ? `${diff}` : 0} words Remaining</span>
+              <span>
+                {" "}
+                {diff >= 0
+                  ? `${diff} words Remaining`
+                  : `0 words Remaining`}{" "}
+              </span>
             </Box>
           )}
           {unit && (
diff --git a/src/components/__tests__/HVCenterContainer.tsx b/src/components/__tests__/HVCenterContainer.tsx
new file mode 100644
index 0000000..4a8d2dc
--- /dev/null
+++ b/src/components/__tests__/HVCenterContainer.tsx
@@ -0,0 +1,18 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import * as React from "react";
+
+import HVCenterContainer from "../HVCenterContainer";
+
+afterEach(cleanup);
+
+describe("HVCenterContainer Component", () => {
+  it("should render snapshot", () => {
+    const children = "This should be rendered inside";
+    const { asFragment } = render(
+      <HVCenterContainer verticalCenter={true} light={true}>
+        {children}
+      </HVCenterContainer>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+});
diff --git a/src/components/__tests__/InlineSelect.tsx b/src/components/__tests__/InlineSelect.tsx
new file mode 100644
index 0000000..78d4f12
--- /dev/null
+++ b/src/components/__tests__/InlineSelect.tsx
@@ -0,0 +1,13 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import * as React from "react";
+
+import SelectQuestion from "../InlineSelect";
+
+afterEach(cleanup);
+
+describe("Select Question Component", () => {
+  it("should render snapshot", () => {
+    const { asFragment } = render(<SelectQuestion />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+});
diff --git a/src/components/__tests__/Loading.tsx b/src/components/__tests__/Loading.tsx
new file mode 100644
index 0000000..6aefaaa
--- /dev/null
+++ b/src/components/__tests__/Loading.tsx
@@ -0,0 +1,17 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import * as React from "react";
+
+import Loading from "../Loading";
+
+afterEach(cleanup);
+
+describe("Loading Component", () => {
+  it("should have loading text in document", async () => {
+    const { findByText } = render(<Loading />);
+    expect(await findByText("Loading...")).toBeInTheDocument();
+  });
+  it("should render snapshot", () => {
+    const { asFragment } = render(<Loading />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+});
diff --git a/src/components/__tests__/MoreInfo.tsx b/src/components/__tests__/MoreInfo.tsx
new file mode 100644
index 0000000..4487f1f
--- /dev/null
+++ b/src/components/__tests__/MoreInfo.tsx
@@ -0,0 +1,18 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import marked from "marked";
+import * as React from "react";
+
+import MoreInfo from "../MoreInfo";
+
+afterEach(cleanup);
+jest.mock("marked");
+
+describe("MoreInfo Component", () => {
+  it("should render snapshot", () => {
+    // console.log(jest.mock("marked"));
+    // const { findByText } = render(
+    //   <MoreInfo open={true} handleClose content="##content title" />
+    // );
+    // expect(findByText("content title")).toBeInTheDocument();
+  });
+});
diff --git a/src/components/__tests__/Question.tsx b/src/components/__tests__/Question.tsx
new file mode 100644
index 0000000..ba4d795
--- /dev/null
+++ b/src/components/__tests__/Question.tsx
@@ -0,0 +1,14 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import * as React from "react";
+
+import Question from "../Question";
+
+afterEach(cleanup);
+
+describe("Question Component", () => {
+  it("render snapshot", () => {
+    const children = "This is a question";
+    const { asFragment } = render(<Question>{children}</Question>);
+    expect(asFragment()).toMatchSnapshot();
+  });
+});
diff --git a/src/components/__tests__/QuestionImage.tsx b/src/components/__tests__/QuestionImage.tsx
new file mode 100644
index 0000000..6042c28
--- /dev/null
+++ b/src/components/__tests__/QuestionImage.tsx
@@ -0,0 +1,17 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import * as React from "react";
+
+import StatementImage from "../QuestionImage";
+
+afterEach(cleanup);
+
+describe("Statement Image Component", () => {
+  it("should render snapshot when image is available", () => {
+    const { asFragment } = render(<StatementImage src={"example.png"} />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+  it("should render snapshot when image is not available", () => {
+    const { asFragment } = render(<StatementImage />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+});
diff --git a/src/components/__tests__/Response.tsx b/src/components/__tests__/Response.tsx
new file mode 100644
index 0000000..b123285
--- /dev/null
+++ b/src/components/__tests__/Response.tsx
@@ -0,0 +1,20 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import * as React from "react";
+
+import Response from "../Response";
+
+afterEach(cleanup);
+
+describe("Response Component", () => {
+  it("should render snapshot when image is available", () => {
+    const response = { id: "1", text: "example text", img: "img.png" };
+    const { asFragment } = render(<Response response={response} />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+  it("should render snapshot when image is not available", () => {
+    const response = { id: "2", text: "example text" };
+
+    const { asFragment } = render(<Response response={response} />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+});
diff --git a/src/components/__tests__/ResponseButton.tsx b/src/components/__tests__/ResponseButton.tsx
new file mode 100644
index 0000000..78e9650
--- /dev/null
+++ b/src/components/__tests__/ResponseButton.tsx
@@ -0,0 +1,60 @@
+import { cleanup, fireEvent, render, waitFor } from "@testing-library/react";
+import * as React from "react";
+
+import ResponseButton from "../ResponseButton";
+
+afterEach(cleanup);
+
+describe("Response Button Component", () => {
+  let handleClick;
+  let response;
+  let responseKey;
+  beforeEach(() => {
+    handleClick = jest.fn();
+    responseKey = "A";
+    response = {
+      id: "1",
+      text: "inner text"
+    };
+  });
+  it("should render snapshot when selected is true", () => {
+    const { asFragment } = render(
+      <ResponseButton
+        key={response.id}
+        handleClick={handleClick}
+        selected={true}
+        responseKey={responseKey}
+      >
+        {response.text}
+      </ResponseButton>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+  it("should render snapshot when selected is false", () => {
+    const { asFragment } = render(
+      <ResponseButton
+        key={response.id}
+        handleClick={handleClick}
+        selected={false}
+        responseKey={responseKey}
+      >
+        {response.text}
+      </ResponseButton>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+  it("should trigger handleClick when clicked", () => {
+    const { getByText } = render(
+      <ResponseButton
+        key={response.id}
+        handleClick={handleClick}
+        selected={false}
+        responseKey={responseKey}
+      >
+        {response.text}
+      </ResponseButton>
+    );
+    fireEvent.click(getByText("inner text"));
+    expect(handleClick).toHaveBeenCalled();
+  });
+});
diff --git a/src/components/__tests__/ResponseImageButton.tsx b/src/components/__tests__/ResponseImageButton.tsx
new file mode 100644
index 0000000..e668c17
--- /dev/null
+++ b/src/components/__tests__/ResponseImageButton.tsx
@@ -0,0 +1,60 @@
+import { cleanup, fireEvent, render } from "@testing-library/react";
+import * as React from "react";
+
+import ResponseImageButton from "../ResponseImageButton";
+
+afterEach(cleanup);
+
+describe("Response Button Component", () => {
+  let handleClick: jest.Mock<any, any>;
+  let children;
+  let responseKey;
+  let image;
+
+  beforeEach(() => {
+    responseKey = "A";
+    handleClick = jest.fn();
+    image = "img.png";
+    children = "Inner text";
+  });
+  it("should render snapshot when selected is true", () => {
+    const { asFragment } = render(
+      <ResponseImageButton
+        image={image}
+        responseKey={responseKey}
+        handleClick={handleClick}
+        selected={true}
+      >
+        {children}
+      </ResponseImageButton>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+  it("should render snapshot when selected is false", () => {
+    const { asFragment } = render(
+      <ResponseImageButton
+        image={image}
+        responseKey={responseKey}
+        handleClick={handleClick}
+        selected={false}
+      >
+        {children}
+      </ResponseImageButton>
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+  it("should trigger handleClick when clicked", async () => {
+    const { getByText } = render(
+      <ResponseImageButton
+        image={image}
+        responseKey={responseKey}
+        handleClick={handleClick}
+        selected={false}
+      >
+        {children}
+      </ResponseImageButton>
+    );
+    fireEvent.click(getByText("Inner text"));
+    expect(handleClick).toHaveBeenCalled();
+  });
+});
diff --git a/src/components/__tests__/Text.tsx b/src/components/__tests__/Text.tsx
index 38ffb79..b66349b 100644
--- a/src/components/__tests__/Text.tsx
+++ b/src/components/__tests__/Text.tsx
@@ -6,13 +6,266 @@ import Text from "../Text";
 afterEach(cleanup);
 
 describe("Text Component", () => {
-  it("should render snapshot", () => {
-    const title = " test title";
-    const name = "test name";
-    const type = "text";
-    const { asFragment } = render(
-      <Text title={title} name={name} type={type} />
-    );
-    expect(asFragment()).toMatchSnapshot();
+  let title: string;
+  let name: string;
+  let type: string;
+  let placeholder: string;
+  let multiline: boolean;
+  let maxWords: number;
+  let label: string;
+  let unit: string;
+
+  beforeEach(() => {
+    title = "test title";
+    name = "test name";
+  });
+  describe("of type short text", () => {
+    beforeEach(() => {
+      placeholder = "short text input placeholder";
+      type = "text";
+      label = "short text input label";
+    });
+    it("should render snapshot", () => {
+      const { asFragment } = render(
+        <Text
+          title={title}
+          label={label}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+        />
+      );
+      expect(asFragment()).toMatchSnapshot();
+    });
+    it("should have the right label and placeholder text", async () => {
+      const { findByPlaceholderText, findByLabelText } = render(
+        <Text
+          title={title}
+          label={label}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+        />
+      );
+      expect(await findByPlaceholderText(placeholder)).toBeInTheDocument();
+      expect(await findByLabelText(label)).toBeInTheDocument();
+    });
+    it("should have a value if an text is entered", async () => {
+      const value = "Lorem ipsum dolor sit amet, consectetur adipiscing";
+      const { findByPlaceholderText, getByPlaceholderText } = render(
+        <Text
+          title={title}
+          label={label}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+        />
+      );
+      fireEvent.change(getByPlaceholderText(placeholder), {
+        target: { value }
+      });
+      expect(await findByPlaceholderText(placeholder)).toHaveValue(value);
+    });
+  });
+  describe("Of type long text", () => {
+    beforeEach(() => {
+      type = "text";
+      maxWords = 10;
+      placeholder = "long text input placeholder";
+      multiline = true;
+      label = "long text input label";
+    });
+    it("should render snapshot", () => {
+      const { asFragment } = render(
+        <Text
+          title={title}
+          label={label}
+          placeholder={placeholder}
+          multiline={multiline}
+          maxWords={maxWords}
+          name={name}
+          type={type}
+        />
+      );
+      expect(asFragment()).toMatchSnapshot();
+    });
+    it("should have the right label and placeholder text", async () => {
+      const { findByPlaceholderText, findByLabelText } = render(
+        <Text
+          title={title}
+          label={label}
+          placeholder={placeholder}
+          multiline={multiline}
+          maxWords={maxWords}
+          name={name}
+          type={type}
+        />
+      );
+      expect(await findByPlaceholderText(placeholder)).toBeInTheDocument();
+      expect(await findByLabelText(label)).toBeInTheDocument();
+    });
+    it("should have a value if an text is entered", async () => {
+      const value =
+        "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
+      const { findByPlaceholderText, getByPlaceholderText } = render(
+        <Text
+          title={title}
+          label={label}
+          placeholder={placeholder}
+          multiline={multiline}
+          maxWords={maxWords}
+          name={name}
+          type={type}
+        />
+      );
+      fireEvent.change(getByPlaceholderText(placeholder), {
+        target: { value }
+      });
+      expect(await findByPlaceholderText(placeholder)).toHaveValue(value);
+    });
+    it("should have a value if an text is entered", async () => {
+      const value =
+        "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
+      const { findByText, getByPlaceholderText } = render(
+        <Text
+          title={title}
+          label={label}
+          placeholder={placeholder}
+          multiline={multiline}
+          maxWords={maxWords}
+          name={name}
+          type={type}
+        />
+      );
+      fireEvent.change(getByPlaceholderText(placeholder), {
+        target: { value }
+      });
+      expect(await findByText("0 words Remaining")).toBeInTheDocument();
+    });
+  });
+  describe("of type Email", () => {
+    beforeEach(() => {
+      type = "email";
+      label = "Email text input label";
+      placeholder = "Email text input placeholder";
+    });
+    it("should render snapshot", () => {
+      const { asFragment } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          label={label}
+        />
+      );
+      expect(asFragment()).toMatchSnapshot();
+    });
+    it("should have the right label and placeholder text", async () => {
+      const { findByPlaceholderText, findByLabelText } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          label={label}
+        />
+      );
+      expect(await findByPlaceholderText(placeholder)).toBeInTheDocument();
+      expect(await findByLabelText(label)).toBeInTheDocument();
+    });
+    it("should have a value if an email is entered", async () => {
+      const { findByPlaceholderText, getByPlaceholderText } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          label={label}
+        />
+      );
+      fireEvent.change(getByPlaceholderText(placeholder), {
+        target: { value: "test@test.com" }
+      });
+      expect(await findByPlaceholderText(placeholder)).toHaveValue(
+        "test@test.com"
+      );
+    });
+  });
+  describe("of type Number", () => {
+    beforeEach(() => {
+      type = "number";
+      label = "number input label";
+      placeholder = "number input placeholder";
+    });
+    it("should render snapshot", () => {
+      const { asFragment } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          label={label}
+        />
+      );
+      expect(asFragment()).toMatchSnapshot();
+    });
+    it("should have the right label and placeholder text", async () => {
+      const { findByPlaceholderText, findByLabelText } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          label={label}
+        />
+      );
+      expect(await findByPlaceholderText(placeholder)).toBeInTheDocument();
+      expect(await findByLabelText(label)).toBeInTheDocument();
+    });
+    it("should render the unit when specified", async () => {
+      const unit = "meters";
+      const { findByText } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          unit={unit}
+          label={label}
+        />
+      );
+      expect(await findByText("meters")).toBeInTheDocument();
+    });
+    it("should not have any value if text is entered", async () => {
+      const { findByPlaceholderText, getByPlaceholderText } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          label={label}
+        />
+      );
+      fireEvent.change(getByPlaceholderText(placeholder), {
+        target: { value: "Test text" }
+      });
+      expect(await findByPlaceholderText(placeholder)).toHaveValue(null);
+    });
+    it("should have a value if a number is entered", async () => {
+      const { findByPlaceholderText, debug, getByPlaceholderText } = render(
+        <Text
+          title={title}
+          placeholder={placeholder}
+          name={name}
+          type={type}
+          label={label}
+        />
+      );
+      fireEvent.change(getByPlaceholderText(placeholder), {
+        target: { value: 123 }
+      });
+      expect(await findByPlaceholderText(placeholder)).toHaveValue(123);
+    });
   });
 });
diff --git a/src/components/__tests__/__snapshots__/ExpandableCheckboxes.tsx.snap b/src/components/__tests__/__snapshots__/ExpandableCheckboxes.tsx.snap
index b08cf41..14b4163 100644
--- a/src/components/__tests__/__snapshots__/ExpandableCheckboxes.tsx.snap
+++ b/src/components/__tests__/__snapshots__/ExpandableCheckboxes.tsx.snap
@@ -43,7 +43,6 @@ exports[`Expandable Checkboxes Component render snapshot 1`] = `
                 aria-hidden="true"
                 class="MuiSvgIcon-root"
                 focusable="false"
-                role="presentation"
                 viewBox="0 0 24 24"
               >
                 <path
@@ -223,7 +222,6 @@ exports[`Expandable Checkboxes Component render snapshot 1`] = `
                 aria-hidden="true"
                 class="MuiSvgIcon-root"
                 focusable="false"
-                role="presentation"
                 viewBox="0 0 24 24"
               >
                 <path
@@ -403,7 +401,6 @@ exports[`Expandable Checkboxes Component render snapshot 1`] = `
                 aria-hidden="true"
                 class="MuiSvgIcon-root"
                 focusable="false"
-                role="presentation"
                 viewBox="0 0 24 24"
               >
                 <path
diff --git a/src/components/__tests__/__snapshots__/HVCenterContainer.tsx.snap b/src/components/__tests__/__snapshots__/HVCenterContainer.tsx.snap
new file mode 100644
index 0000000..79fed5d
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/HVCenterContainer.tsx.snap
@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`HVCenterContainer Component should render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiBox-root MuiBox-root-3 makeStyles-root-1"
+    style="align-items: center; display: flex;"
+  >
+    <div
+      class="MuiContainer-root MuiContainer-maxWidthMd"
+    >
+      This should be rendered inside
+    </div>
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/__snapshots__/InlineSelect.tsx.snap b/src/components/__tests__/__snapshots__/InlineSelect.tsx.snap
new file mode 100644
index 0000000..d87a37a
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/InlineSelect.tsx.snap
@@ -0,0 +1,41 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Select Question Component should render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiFormControl-root makeStyles-container-1"
+  >
+    <div
+      class="MuiInputBase-root MuiInput-root makeStyles-formControl-7 MuiInputBase-formControl MuiInput-formControl"
+    >
+      <div
+        aria-haspopup="listbox"
+        aria-labelledby="mui-component-select-select"
+        class="MuiSelect-root MuiSelect-select makeStyles-selectInput-3 MuiSelect-selectMenu makeStyles-root-2 MuiInputBase-input MuiInput-input"
+        id="mui-component-select-select"
+        role="button"
+        tabindex="0"
+      >
+        <span>
+          ​
+        </span>
+      </div>
+      <input
+        name="select"
+        type="hidden"
+        value=""
+      />
+      <svg
+        aria-hidden="true"
+        class="MuiSvgIcon-root MuiSelect-icon makeStyles-icon-6"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        <path
+          d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"
+        />
+      </svg>
+    </div>
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/__snapshots__/Loading.tsx.snap b/src/components/__tests__/__snapshots__/Loading.tsx.snap
new file mode 100644
index 0000000..8565c7c
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/Loading.tsx.snap
@@ -0,0 +1,34 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Loading Component should render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiBox-root MuiBox-root-17"
+  >
+    <div
+      class="MuiCircularProgress-root MuiCircularProgress-indeterminate"
+      role="progressbar"
+      style="width: 40px; height: 40px;"
+    >
+      <svg
+        class="MuiCircularProgress-svg"
+        viewBox="22 22 44 44"
+      >
+        <circle
+          class="MuiCircularProgress-circle MuiCircularProgress-circleIndeterminate"
+          cx="44"
+          cy="44"
+          fill="none"
+          r="20.2"
+          stroke-width="3.6"
+        />
+      </svg>
+    </div>
+    <div
+      class="MuiBox-root MuiBox-root-30"
+    >
+      Loading...
+    </div>
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/__snapshots__/Question.tsx.snap b/src/components/__tests__/__snapshots__/Question.tsx.snap
new file mode 100644
index 0000000..d4cca34
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/Question.tsx.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Question Component render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiTypography-root makeStyles-question-1 MuiTypography-h2"
+  >
+    This is a question
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/__snapshots__/QuestionImage.tsx.snap b/src/components/__tests__/__snapshots__/QuestionImage.tsx.snap
new file mode 100644
index 0000000..dc90c09
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/QuestionImage.tsx.snap
@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Statement Image Component should render snapshot when image is available 1`] = `
+<DocumentFragment>
+  <div
+    class="makeStyles-root-1"
+  >
+    <img
+      alt=""
+      src="example.png"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Statement Image Component should render snapshot when image is not available 1`] = `<DocumentFragment />`;
diff --git a/src/components/__tests__/__snapshots__/Response.tsx.snap b/src/components/__tests__/__snapshots__/Response.tsx.snap
new file mode 100644
index 0000000..a4c4644
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/Response.tsx.snap
@@ -0,0 +1,84 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Response Component should render snapshot when image is available 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6 MuiGrid-grid-sm-4 MuiGrid-grid-lg-3"
+  >
+    <button
+      class="MuiButtonBase-root makeStyles-root-104"
+      tabindex="0"
+      type="button"
+    >
+      <div
+        class="makeStyles-imageContainer-105"
+      >
+        <img
+          src="img.png"
+        />
+      </div>
+      <div
+        class="MuiGrid-root makeStyles-text-109 MuiGrid-container MuiGrid-wrap-xs-nowrap"
+      >
+        <div
+          class="MuiGrid-root makeStyles-key-108 MuiGrid-item"
+        >
+          <p
+            class="MuiTypography-root makeStyles-type-110 MuiTypography-body1 MuiTypography-colorInherit"
+          >
+            A
+          </p>
+        </div>
+        <div
+          class="MuiGrid-root MuiGrid-item"
+        >
+          <p
+            class="MuiTypography-root makeStyles-type-110 MuiTypography-body1 MuiTypography-colorInherit"
+          >
+            example text
+          </p>
+        </div>
+      </div>
+      <span
+        class="MuiTouchRipple-root"
+      />
+    </button>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Response Component should render snapshot when image is not available 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
+  >
+    <button
+      class="MuiButtonBase-root makeStyles-root-257"
+      tabindex="0"
+      type="button"
+    >
+      <div
+        class="MuiBox-root MuiBox-root-265 makeStyles-key-258"
+      >
+        <span
+          class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInherit MuiTypography-alignLeft"
+        >
+          A
+        </span>
+      </div>
+      <div
+        class="MuiBox-root MuiBox-root-296 makeStyles-text-260"
+      >
+        <span
+          class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInherit MuiTypography-alignLeft"
+        >
+          example text
+        </span>
+      </div>
+      <span
+        class="MuiTouchRipple-root"
+      />
+    </button>
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/__snapshots__/ResponseButton.tsx.snap b/src/components/__tests__/__snapshots__/ResponseButton.tsx.snap
new file mode 100644
index 0000000..c786cad
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/ResponseButton.tsx.snap
@@ -0,0 +1,65 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Response Button Component should render snapshot when selected is false 1`] = `
+<DocumentFragment>
+  <button
+    class="MuiButtonBase-root makeStyles-root-51"
+    tabindex="0"
+    type="button"
+  >
+    <div
+      class="MuiBox-root MuiBox-root-59 makeStyles-key-52"
+    >
+      <span
+        class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInherit MuiTypography-alignLeft"
+      >
+        A
+      </span>
+    </div>
+    <div
+      class="MuiBox-root MuiBox-root-90 makeStyles-text-54"
+    >
+      <span
+        class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInherit MuiTypography-alignLeft"
+      >
+        inner text
+      </span>
+    </div>
+    <span
+      class="MuiTouchRipple-root"
+    />
+  </button>
+</DocumentFragment>
+`;
+
+exports[`Response Button Component should render snapshot when selected is true 1`] = `
+<DocumentFragment>
+  <button
+    class="MuiButtonBase-root makeStyles-root-1 makeStyles-selected-3"
+    tabindex="0"
+    type="button"
+  >
+    <div
+      class="MuiBox-root MuiBox-root-9 makeStyles-key-2"
+    >
+      <span
+        class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInherit MuiTypography-alignLeft"
+      >
+        A
+      </span>
+    </div>
+    <div
+      class="MuiBox-root MuiBox-root-40 makeStyles-text-4"
+    >
+      <span
+        class="MuiTypography-root MuiTypography-h6 MuiTypography-colorInherit MuiTypography-alignLeft"
+      >
+        inner text
+      </span>
+    </div>
+    <span
+      class="MuiTouchRipple-root"
+    />
+  </button>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/__snapshots__/ResponseImageButton.tsx.snap b/src/components/__tests__/__snapshots__/ResponseImageButton.tsx.snap
new file mode 100644
index 0000000..4244c4b
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/ResponseImageButton.tsx.snap
@@ -0,0 +1,80 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Response Button Component should render snapshot when selected is false 1`] = `
+<DocumentFragment>
+  <button
+    class="MuiButtonBase-root makeStyles-root-144"
+    tabindex="0"
+    type="button"
+  >
+    <div
+      class="makeStyles-imageContainer-145"
+    >
+      img.png
+    </div>
+    <div
+      class="MuiGrid-root makeStyles-text-149 MuiGrid-container MuiGrid-wrap-xs-nowrap"
+    >
+      <div
+        class="MuiGrid-root makeStyles-key-148 MuiGrid-item"
+      >
+        <p
+          class="MuiTypography-root makeStyles-type-150 MuiTypography-body1 MuiTypography-colorInherit"
+        >
+          A
+        </p>
+      </div>
+      <div
+        class="MuiGrid-root MuiGrid-item"
+      >
+        <p
+          class="MuiTypography-root makeStyles-type-150 MuiTypography-body1 MuiTypography-colorInherit"
+        >
+          Inner text
+        </p>
+      </div>
+    </div>
+    <span
+      class="MuiTouchRipple-root"
+    />
+  </button>
+</DocumentFragment>
+`;
+
+exports[`Response Button Component should render snapshot when selected is true 1`] = `
+<DocumentFragment>
+  <button
+    class="MuiButtonBase-root makeStyles-root-1 makeStyles-selected-3"
+    tabindex="0"
+    type="button"
+  >
+    <div
+      class="makeStyles-imageContainer-2"
+    >
+      img.png
+    </div>
+    <div
+      class="MuiGrid-root makeStyles-text-6 MuiGrid-container MuiGrid-wrap-xs-nowrap"
+    >
+      <div
+        class="MuiGrid-root makeStyles-key-5 MuiGrid-item"
+      >
+        <p
+          class="MuiTypography-root makeStyles-type-7 MuiTypography-body1 MuiTypography-colorInherit"
+        >
+          A
+        </p>
+      </div>
+      <div
+        class="MuiGrid-root MuiGrid-item"
+      >
+        <p
+          class="MuiTypography-root makeStyles-type-7 MuiTypography-body1 MuiTypography-colorInherit"
+        >
+          Inner text
+        </p>
+      </div>
+    </div>
+  </button>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/__snapshots__/StreetAddress.tsx.snap b/src/components/__tests__/__snapshots__/StreetAddress.tsx.snap
index 86fb828..e8e99d0 100644
--- a/src/components/__tests__/__snapshots__/StreetAddress.tsx.snap
+++ b/src/components/__tests__/__snapshots__/StreetAddress.tsx.snap
@@ -3,180 +3,176 @@
 exports[`Street Address Component should render snapshot 1`] = `
 <DocumentFragment>
   <div
-    class="MuiContainer-root MuiContainer-maxWidthMd"
+    class="MuiBox-root MuiBox-root-2"
   >
-    <div
-      class="MuiBox-root MuiBox-root-10"
-    >
-      <form>
-        <h4
-          class="MuiTypography-root MuiTypography-h4 MuiTypography-gutterBottom"
+    <form>
+      <h4
+        class="MuiTypography-root MuiTypography-h4 MuiTypography-gutterBottom"
+      >
+        <strong>
+           test title
+        </strong>
+      </h4>
+      <div>
+        <div
+          class="MuiBox-root MuiBox-root-33"
         >
-          <strong>
-             test title
-          </strong>
-        </h4>
-        <div>
           <div
-            class="MuiBox-root MuiBox-root-41"
+            class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
           >
+            <label
+              class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
+              data-shrink="false"
+            >
+              Building and street
+            </label>
             <div
-              class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
+              class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
             >
-              <label
-                class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
-                data-shrink="false"
-              >
-                Building and street
-              </label>
-              <div
-                class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
-              >
-                <input
-                  aria-invalid="false"
-                  class="MuiInputBase-input MuiInput-input"
-                  name="test name-building"
-                  placeholder="building"
-                  type="text"
-                  value=""
-                />
-              </div>
+              <input
+                aria-invalid="false"
+                class="MuiInputBase-input MuiInput-input"
+                name="test name-building"
+                placeholder="building"
+                type="text"
+                value=""
+              />
             </div>
           </div>
         </div>
-        <div>
+      </div>
+      <div>
+        <div
+          class="MuiBox-root MuiBox-root-91"
+        >
           <div
-            class="MuiBox-root MuiBox-root-99"
+            class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
           >
             <div
-              class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
+              class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
             >
-              <div
-                class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
-              >
-                <input
-                  aria-invalid="false"
-                  class="MuiInputBase-input MuiInput-input"
-                  name="test name-street"
-                  placeholder="street"
-                  required=""
-                  type="text"
-                  value=""
-                />
-              </div>
+              <input
+                aria-invalid="false"
+                class="MuiInputBase-input MuiInput-input"
+                name="test name-street"
+                placeholder="street"
+                required=""
+                type="text"
+                value=""
+              />
             </div>
           </div>
         </div>
-        <div>
+      </div>
+      <div>
+        <div
+          class="MuiBox-root MuiBox-root-92"
+        >
           <div
-            class="MuiBox-root MuiBox-root-100"
+            class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
           >
-            <div
-              class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
+            <label
+              class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated Mui-required Mui-required"
+              data-shrink="false"
             >
-              <label
-                class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated Mui-required Mui-required"
-                data-shrink="false"
+              Town or City
+              <span
+                class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
               >
-                Town or City
-                <span
-                  class="MuiFormLabel-asterisk MuiInputLabel-asterisk"
-                >
-                   *
-                </span>
-              </label>
-              <div
-                class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
-              >
-                <input
-                  aria-invalid="false"
-                  class="MuiInputBase-input MuiInput-input"
-                  name="test name-city"
-                  placeholder="city"
-                  required=""
-                  type="text"
-                  value=""
-                />
-              </div>
+                 *
+              </span>
+            </label>
+            <div
+              class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
+            >
+              <input
+                aria-invalid="false"
+                class="MuiInputBase-input MuiInput-input"
+                name="test name-city"
+                placeholder="city"
+                required=""
+                type="text"
+                value=""
+              />
             </div>
           </div>
         </div>
-        <div>
+      </div>
+      <div>
+        <div
+          class="MuiBox-root MuiBox-root-93"
+        >
           <div
-            class="MuiBox-root MuiBox-root-101"
+            class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
           >
+            <label
+              class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
+              data-shrink="false"
+            >
+              county
+            </label>
             <div
-              class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
+              class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
             >
-              <label
-                class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
-                data-shrink="false"
-              >
-                county
-              </label>
-              <div
-                class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
-              >
-                <input
-                  aria-invalid="false"
-                  class="MuiInputBase-input MuiInput-input"
-                  name="test name-county"
-                  placeholder="county"
-                  type="text"
-                  value=""
-                />
-              </div>
+              <input
+                aria-invalid="false"
+                class="MuiInputBase-input MuiInput-input"
+                name="test name-county"
+                placeholder="county"
+                type="text"
+                value=""
+              />
             </div>
           </div>
         </div>
-        <div>
+      </div>
+      <div>
+        <div
+          class="MuiBox-root MuiBox-root-94"
+        >
           <div
-            class="MuiBox-root MuiBox-root-102"
+            class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
           >
+            <label
+              class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
+              data-shrink="false"
+            >
+              postcode
+            </label>
             <div
-              class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
+              class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
             >
-              <label
-                class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
-                data-shrink="false"
-              >
-                postcode
-              </label>
-              <div
-                class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-formControl MuiInput-formControl"
-              >
-                <input
-                  aria-invalid="false"
-                  class="MuiInputBase-input MuiInput-input"
-                  name="test name-postcode"
-                  placeholder="postcode"
-                  type="text"
-                  value=""
-                />
-              </div>
+              <input
+                aria-invalid="false"
+                class="MuiInputBase-input MuiInput-input"
+                name="test name-postcode"
+                placeholder="postcode"
+                type="text"
+                value=""
+              />
             </div>
           </div>
         </div>
-        <div
-          class="MuiBox-root MuiBox-root-103"
+      </div>
+      <div
+        class="MuiBox-root MuiBox-root-95"
+      >
+        <button
+          class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary"
+          tabindex="0"
+          type="submit"
         >
-          <button
-            class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary"
-            tabindex="0"
-            type="submit"
+          <span
+            class="MuiButton-label"
           >
-            <span
-              class="MuiButton-label"
-            >
-              Look up address
-            </span>
-            <span
-              class="MuiTouchRipple-root"
-            />
-          </button>
-        </div>
-      </form>
-    </div>
+            Look up address
+          </span>
+          <span
+            class="MuiTouchRipple-root"
+          />
+        </button>
+      </div>
+    </form>
   </div>
 </DocumentFragment>
 `;
diff --git a/src/components/__tests__/__snapshots__/Text.tsx.snap b/src/components/__tests__/__snapshots__/Text.tsx.snap
index 486b9ca..8d3f341 100644
--- a/src/components/__tests__/__snapshots__/Text.tsx.snap
+++ b/src/components/__tests__/__snapshots__/Text.tsx.snap
@@ -1,6 +1,134 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Text Component should render snapshot 1`] = `
+exports[`Text Component Of type long text should render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiBox-root MuiBox-root-257"
+  >
+    <form>
+      <h5
+        class="MuiTypography-root MuiTypography-h5 MuiTypography-gutterBottom"
+      >
+        test title
+      </h5>
+      <div
+        class="MuiBox-root MuiBox-root-288"
+      >
+        <label
+          class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-animated"
+          for="test name"
+        >
+          long text input label
+        </label>
+        <div
+          class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth MuiInputBase-multiline MuiInput-multiline"
+          max="Infinity"
+          min="0"
+        >
+          <textarea
+            class="MuiInputBase-input MuiInput-input MuiInputBase-inputMultiline MuiInput-inputMultiline"
+            id="test name"
+            name="test name"
+            placeholder="long text input placeholder"
+            rows="5"
+          />
+        </div>
+        <div
+          class="MuiBox-root MuiBox-root-341"
+        >
+          <span>
+             10 words Remaining 
+          </span>
+        </div>
+      </div>
+    </form>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Text Component of type Email should render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiBox-root MuiBox-root-601"
+  >
+    <form>
+      <h5
+        class="MuiTypography-root MuiTypography-h5 MuiTypography-gutterBottom"
+      >
+        test title
+      </h5>
+      <div
+        class="MuiBox-root MuiBox-root-632"
+      >
+        <label
+          class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-animated"
+          for="test name"
+        >
+          Email text input label
+        </label>
+        <div
+          class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth"
+          max="Infinity"
+          min="0"
+        >
+          <input
+            class="MuiInputBase-input MuiInput-input"
+            id="test name"
+            name="test name"
+            placeholder="Email text input placeholder"
+            rows="1"
+            type="email"
+            value=""
+          />
+        </div>
+      </div>
+    </form>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Text Component of type Number should render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    class="MuiBox-root MuiBox-root-856"
+  >
+    <form>
+      <h5
+        class="MuiTypography-root MuiTypography-h5 MuiTypography-gutterBottom"
+      >
+        test title
+      </h5>
+      <div
+        class="MuiBox-root MuiBox-root-887"
+      >
+        <label
+          class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-animated"
+          for="test name"
+        >
+          number input label
+        </label>
+        <div
+          class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth"
+          max="Infinity"
+          min="0"
+        >
+          <input
+            class="MuiInputBase-input MuiInput-input"
+            id="test name"
+            name="test name"
+            placeholder="number input placeholder"
+            rows="1"
+            type="number"
+            value=""
+          />
+        </div>
+      </div>
+    </form>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Text Component of type short text should render snapshot 1`] = `
 <DocumentFragment>
   <div
     class="MuiBox-root MuiBox-root-2"
@@ -9,11 +137,17 @@ exports[`Text Component should render snapshot 1`] = `
       <h5
         class="MuiTypography-root MuiTypography-h5 MuiTypography-gutterBottom"
       >
-         test title
+        test title
       </h5>
       <div
         class="MuiBox-root MuiBox-root-33"
       >
+        <label
+          class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-animated"
+          for="test name"
+        >
+          short text input label
+        </label>
         <div
           class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-fullWidth MuiInput-fullWidth"
           max="Infinity"
@@ -21,8 +155,9 @@ exports[`Text Component should render snapshot 1`] = `
         >
           <input
             class="MuiInputBase-input MuiInput-input"
+            id="test name"
             name="test name"
-            placeholder=""
+            placeholder="short text input placeholder"
             rows="1"
             type="text"
             value=""
diff --git a/src/components/__tests__/__snapshots__/inlineText.tsx.snap b/src/components/__tests__/__snapshots__/inlineText.tsx.snap
new file mode 100644
index 0000000..ca2ca8a
--- /dev/null
+++ b/src/components/__tests__/__snapshots__/inlineText.tsx.snap
@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Text Question Component should render snapshot 1`] = `
+<DocumentFragment>
+  <div
+    autocapitalize="off"
+    autocorrect="off"
+    class="MuiInputBase-root MuiInput-root makeStyles-root-1"
+    spellcheck="false"
+  >
+    <input
+      autocomplete="off"
+      class="MuiInputBase-input MuiInput-input makeStyles-input-3"
+      type="text"
+      value=""
+    />
+  </div>
+</DocumentFragment>
+`;
diff --git a/src/components/__tests__/inlineText.tsx b/src/components/__tests__/inlineText.tsx
new file mode 100644
index 0000000..541da79
--- /dev/null
+++ b/src/components/__tests__/inlineText.tsx
@@ -0,0 +1,13 @@
+import { cleanup, fireEvent, render, wait } from "@testing-library/react";
+import * as React from "react";
+
+import TextQuestion from "../InlineText";
+
+afterEach(cleanup);
+
+describe("Text Question Component", () => {
+  it("should render snapshot", () => {
+    const { asFragment } = render(<TextQuestion />);
+    expect(asFragment()).toMatchSnapshot();
+  });
+});