diff --git a/demo/gradio_pdf_demo/run.ipynb b/demo/gradio_pdf_demo/run.ipynb
new file mode 100644
index 0000000000..699dd3292c
--- /dev/null
+++ b/demo/gradio_pdf_demo/run.ipynb
@@ -0,0 +1 @@
+{"cells": [{"cell_type": "markdown", "id": "302934307671667531413257853548643485645", "metadata": {}, "source": ["# Gradio Demo: gradio_pdf_demo"]}, {"cell_type": "code", "execution_count": null, "id": "272996653310673477252411125948039410165", "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": "288918539441861185822528903084949547379", "metadata": {}, "outputs": [], "source": ["import gradio as gr\n", "from gradio_pdf import PDF\n", "\n", "\n", "demo = gr.Interface(lambda x: x,\n", "                    PDF(),\n", "                    gr.File())\n", "\n", "if __name__ == \"__main__\":\n", "    demo.launch()"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}
\ No newline at end of file
diff --git a/demo/gradio_pdf_demo/run.py b/demo/gradio_pdf_demo/run.py
new file mode 100644
index 0000000000..a88a32e5e2
--- /dev/null
+++ b/demo/gradio_pdf_demo/run.py
@@ -0,0 +1,10 @@
+import gradio as gr
+from gradio_pdf import PDF
+
+
+demo = gr.Interface(lambda x: x,
+                    PDF(),
+                    gr.File())
+
+if __name__ == "__main__":
+    demo.launch()
\ No newline at end of file
diff --git a/js/app/test/files/contract.pdf b/js/app/test/files/contract.pdf
new file mode 100644
index 0000000000..4d7abecf8a
Binary files /dev/null and b/js/app/test/files/contract.pdf differ
diff --git a/js/app/test/gradio_pdf_demo.spec.ts b/js/app/test/gradio_pdf_demo.spec.ts
new file mode 100644
index 0000000000..76d92555c0
--- /dev/null
+++ b/js/app/test/gradio_pdf_demo.spec.ts
@@ -0,0 +1,21 @@
+import { test, expect } from "@gradio/tootils";
+
+test("Custom PDF component demo can be loaded and inference function works .", async ({
+	page
+}) => {
+	await page
+		.getByRole("button", { name: "Drop PDF - or - Click to Upload" })
+		.first()
+		.click();
+	const uploader = await page.locator("input[type=file]").first();
+	await uploader.setInputFiles(["./test/files/contract.pdf"]);
+
+	await page.getByRole("button", { name: "Submit" }).click();
+
+	await expect(page.getByLabel("contract.pdf")).toBeVisible();
+
+	const downloadPromise = page.waitForEvent("download");
+	await page.getByRole("link").nth(0).click();
+	const download = await downloadPromise;
+	await expect(download.suggestedFilename()).toBe("contract.pdf");
+});
diff --git a/test/requirements.txt b/test/requirements.txt
index 1fd957222f..0d94934cb7 100644
--- a/test/requirements.txt
+++ b/test/requirements.txt
@@ -40,7 +40,7 @@ filelock==3.7.1
     # via
     #   huggingface-hub
     #   transformers
-gradio_pdf==0.0.3
+gradio_pdf==0.0.5
     # via -r requirements.in
 h11==0.12.0
     # via httpcore