diff --git a/examples/index.jsx b/examples/index.jsx
index e3402d3..fac013b 100644
--- a/examples/index.jsx
+++ b/examples/index.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import ReactDOM from 'react-dom';
-import { DiscussionEmbed, CommentCount, CommentEmbed, Recommendations } from 'disqus-react';
+import { DiscussionEmbed, CommentCount, CommentEmbed } from 'disqus-react';
/* eslint-disable max-len */
const ARTICLES = {
@@ -114,7 +114,6 @@ class Article extends React.Component {
{this.state.articleId ?
-
- :
+
+ :
}
diff --git a/src/CommentCount.jsx b/src/CommentCount.jsx
index 182ab8b..51eeae7 100644
--- a/src/CommentCount.jsx
+++ b/src/CommentCount.jsx
@@ -1,6 +1,12 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { insertScript, removeScript, debounce, shallowComparison } from './utils';
+import {
+ insertScript,
+ removeScript,
+ debounce,
+ shallowComparison,
+ removeResources,
+} from './utils';
// Constants
import {
COMMENT_COUNT_CLASS,
@@ -48,6 +54,7 @@ export class CommentCount extends React.Component {
// count.js only reassigns this window object if it's undefined.
window.DISQUSWIDGETS = undefined;
+ removeResources();
}
render() {
diff --git a/src/DiscussionEmbed.jsx b/src/DiscussionEmbed.jsx
index 7fc5f0c..bc29ee6 100644
--- a/src/DiscussionEmbed.jsx
+++ b/src/DiscussionEmbed.jsx
@@ -1,6 +1,11 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { insertScript, removeScript, shallowComparison } from './utils';
+import {
+ insertScript,
+ removeResources,
+ removeScript,
+ shallowComparison,
+} from './utils';
// Constants
import {
CALLBACKS,
@@ -64,6 +69,7 @@ export class DiscussionEmbed extends React.Component {
while (disqusThread.hasChildNodes())
disqusThread.removeChild(disqusThread.firstChild);
}
+ removeResources();
}
getDisqusConfig(config) {
diff --git a/src/Recommendations.jsx b/src/Recommendations.jsx
index c9a348a..42a4f19 100644
--- a/src/Recommendations.jsx
+++ b/src/Recommendations.jsx
@@ -1,6 +1,11 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { insertScript, removeScript, shallowComparison } from './utils';
+import {
+ insertScript,
+ removeScript,
+ shallowComparison,
+ removeResources,
+} from './utils';
// Constants
import {
RECOMMENDATIONS_ID,
@@ -72,6 +77,7 @@ export class Recommendations extends React.Component {
while (recommendations.hasChildNodes())
recommendations.removeChild(recommendations.firstChild);
}
+ removeResources();
}
render() {
diff --git a/src/utils.js b/src/utils.js
index 56c69a4..7741ec0 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -16,6 +16,15 @@ export function removeScript(id, parentElement) {
parentElement.removeChild(script);
}
+export function removeResources() {
+ // Remove the bundles that the Disqus scripts add to prevent duplicated resources when navigating between pages
+ const disqusResources = window.document.querySelectorAll(
+ // eslint-disable-next-line max-len
+ 'link[href*="disquscdn.com/next/embed"], link[href*="disquscdn.com/next/recommendations"], link[href*="disqus.com/next/config.js"], script[src*="disquscdn.com/next/embed"], script[src*="disqus.com/count-data.js"], iframe[title="Disqus"]'
+ );
+ disqusResources.forEach(el => el.remove());
+}
+
export function debounce(func, wait, runOnFirstCall) {
let timeout;
return function () {
diff --git a/tests/CommentCount.js b/tests/CommentCount.js
index 3547646..38b0c59 100644
--- a/tests/CommentCount.js
+++ b/tests/CommentCount.js
@@ -80,6 +80,9 @@ test('Cleans script and window attributes on unmount', () => {
const scriptQuery = baseElement.querySelectorAll(`#${COMMENT_COUNT_SCRIPT_ID}`);
// Make sure the script is removed
expect(scriptQuery.length).toEqual(0);
+ // Make sure the resources created by the count script are removed
+ const resourcesQuery = baseElement.querySelectorAll('script[src*="disqus.com/count-data.js"]');
+ expect(resourcesQuery.length).toEqual(0);
// Make sure window.DISQUSWIDGETS is removed
expect(global.window.DISQUSWIDGETS).toBeUndefined();
});
diff --git a/tests/DiscussionEmbed.js b/tests/DiscussionEmbed.js
index d1630e0..d647ca2 100644
--- a/tests/DiscussionEmbed.js
+++ b/tests/DiscussionEmbed.js
@@ -52,8 +52,11 @@ test('Cleans script and window attributes on unmount', () => {
const { baseElement, unmount } = render();
unmount();
const scriptQuery = baseElement.querySelectorAll(`#${EMBED_SCRIPT_ID}`);
- // Make sure the script is removed
+ // Make sure the embed script is removed
expect(scriptQuery.length).toEqual(0);
+ // Make sure the resources created by the embed script are removed
+ const resourcesQuery = baseElement.querySelectorAll('link[href*="disquscdn.com/next/embed"], link[href*="disqus.com/next/config.js"], script[src*="disquscdn.com/next/embed"]');
+ expect(resourcesQuery.length).toEqual(0);
// Make sure window.DISQUS is removed
expect(global.window.DISQUS).toBeUndefined();
});
diff --git a/tests/Recommendations.js b/tests/Recommendations.js
index f811949..43cc4f5 100644
--- a/tests/Recommendations.js
+++ b/tests/Recommendations.js
@@ -54,6 +54,9 @@ test('Cleans script and window attributes on unmount', () => {
const scriptQuery = baseElement.querySelectorAll(`#${RECOMMENDATIONS_SCRIPT_ID}`);
// Make sure the script is removed
expect(scriptQuery.length).toEqual(0);
+ // Make sure the resources created by the embed script are removed
+ const resourcesQuery = baseElement.querySelectorAll('link[href*="disquscdn.com/next/recommendations"]');
+ expect(resourcesQuery.length).toEqual(0);
// Make sure window.DISQUS is removed
expect(global.window.DISQUS_RECOMMENDATIONS).toBeUndefined();
});