diff --git a/src/core/client/stream/containers/PermalinkViewContainer.tsx b/src/core/client/stream/containers/PermalinkViewContainer.tsx
index 769ecc7ff..65fede9d8 100644
--- a/src/core/client/stream/containers/PermalinkViewContainer.tsx
+++ b/src/core/client/stream/containers/PermalinkViewContainer.tsx
@@ -10,8 +10,8 @@ import {
import PermalinkView from "../components/PermalinkView";
interface PermalinkViewContainerProps {
- comment: CommentData;
- asset: AssetData;
+ comment: CommentData | null;
+ asset: AssetData | null;
setCommentID: SetCommentIDMutation;
}
@@ -26,7 +26,7 @@ class PermalinkViewContainer extends React.Component<
return (
);
@@ -34,7 +34,10 @@ class PermalinkViewContainer extends React.Component<
}
const enhanced = withSetCommentIDMutation(
- withFragmentContainer<{ comment: CommentData; asset: AssetData }>({
+ withFragmentContainer<{
+ comment: CommentData | null;
+ asset: AssetData | null;
+ }>({
comment: graphql`
fragment PermalinkViewContainer_comment on Comment {
...CommentContainer
diff --git a/src/core/client/stream/test/__snapshots__/permalinkViewAssetNotFound.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/permalinkViewAssetNotFound.spec.tsx.snap
new file mode 100644
index 000000000..270fae18d
--- /dev/null
+++ b/src/core/client/stream/test/__snapshots__/permalinkViewAssetNotFound.spec.tsx.snap
@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders permalink view with unknown asset 1`] = `
+
+
+
+ Comment not found
+
+
+
+`;
diff --git a/src/core/client/stream/test/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap
new file mode 100644
index 000000000..6e094cf1e
--- /dev/null
+++ b/src/core/client/stream/test/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap
@@ -0,0 +1,109 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders permalink view with unknown comment 1`] = `
+
+
+
+
+ Comment not found
+
+
+
+`;
+
+exports[`show all comments 1`] = `
+
+`;
diff --git a/src/core/client/stream/test/permalinkViewAssetNotFound.spec.tsx b/src/core/client/stream/test/permalinkViewAssetNotFound.spec.tsx
new file mode 100644
index 000000000..17be1416e
--- /dev/null
+++ b/src/core/client/stream/test/permalinkViewAssetNotFound.spec.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+import TestRenderer from "react-test-renderer";
+import { RecordProxy } from "relay-runtime";
+
+import { timeout } from "talk-common/utils";
+import { TalkContext, TalkContextProvider } from "talk-framework/lib/bootstrap";
+import AppContainer from "talk-stream/containers/AppContainer";
+
+import createEnvironment from "./createEnvironment";
+
+const resolvers = {
+ Query: {
+ comment: () => null,
+ asset: () => null,
+ },
+};
+
+const environment = createEnvironment({
+ // Set this to true, to see graphql responses.
+ logNetwork: false,
+ resolvers,
+ initLocalState: (localRecord: RecordProxy) => {
+ localRecord.setValue("unknown-asset-id", "assetID");
+ localRecord.setValue("unknown-comment-id", "commentID");
+ },
+});
+
+const context: TalkContext = {
+ relayEnvironment: environment,
+ localeMessages: [],
+};
+
+const testRenderer = TestRenderer.create(
+
+
+
+);
+
+it("renders permalink view with unknown asset", async () => {
+ // Wait for loading.
+ await timeout();
+ expect(testRenderer.toJSON()).toMatchSnapshot();
+});
diff --git a/src/core/client/stream/test/permalinkViewCommentNotFound.spec.tsx b/src/core/client/stream/test/permalinkViewCommentNotFound.spec.tsx
new file mode 100644
index 000000000..3f905ce4b
--- /dev/null
+++ b/src/core/client/stream/test/permalinkViewCommentNotFound.spec.tsx
@@ -0,0 +1,78 @@
+import React from "react";
+import TestRenderer from "react-test-renderer";
+import { RecordProxy } from "relay-runtime";
+import sinon from "sinon";
+
+import { timeout } from "talk-common/utils";
+import { TalkContext, TalkContextProvider } from "talk-framework/lib/bootstrap";
+import AppContainer from "talk-stream/containers/AppContainer";
+
+import createEnvironment from "./createEnvironment";
+import { assets, comments } from "./fixtures";
+
+const commentStub = {
+ ...comments[0],
+};
+
+const assetStub = {
+ ...assets[0],
+ comments: {
+ pageInfo: {
+ hasNextPage: false,
+ },
+ edges: [
+ {
+ node: commentStub,
+ cursor: commentStub.createdAt,
+ },
+ ],
+ },
+};
+
+const resolvers = {
+ Query: {
+ comment: () => null,
+ asset: sinon
+ .stub()
+ .throws()
+ .withArgs(undefined, { id: assetStub.id })
+ .returns(assetStub),
+ },
+};
+
+const environment = createEnvironment({
+ // Set this to true, to see graphql responses.
+ logNetwork: false,
+ resolvers,
+ initLocalState: (localRecord: RecordProxy) => {
+ localRecord.setValue(assetStub.id, "assetID");
+ localRecord.setValue("unknown-comment-id", "commentID");
+ },
+});
+
+const context: TalkContext = {
+ relayEnvironment: environment,
+ localeMessages: [],
+};
+
+const testRenderer = TestRenderer.create(
+
+
+
+);
+
+it("renders permalink view with unknown comment", async () => {
+ // Wait for loading.
+ await timeout();
+ expect(testRenderer.toJSON()).toMatchSnapshot();
+});
+
+it("show all comments", async () => {
+ testRenderer.root
+ .findByProps({
+ id: "talk-comments-permalinkView-showAllComments",
+ })
+ .props.onClick();
+ await timeout();
+ expect(testRenderer.toJSON()).toMatchSnapshot();
+});