@contentful/react-apps-toolkit 0.2.1 → 0.3.0

package/dist/SDKProvider.js

@@ -19,6 +19,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = __importDefault(require("react"));
 var app_sdk_1 = require("@contentful/app-sdk");
 exports.SDKContext = react_1.default.createContext({ sdk: null });
+var DELAY_TIMEOUT = 4 * 1000;
 /**
  * The Component providing the AppSdk, the useSDK hook can only be used within this Provider
  * @param props.loading an optional loading element that gets rendered while initializing the app
@@ -26,7 +27,14 @@ exports.SDKContext = react_1.default.createContext({ sdk: null });
 var SDKProvider = function (props) {
     var _a = react_1.default.useState(), sdk = _a[0], setSDK = _a[1];
     react_1.default.useEffect(function () {
-        (0, app_sdk_1.init)(setSDK);
+        var timeout = window.setTimeout(function () {
+            console.warn("Your app is taking longer than expected to initialize. If you think this is an error with Contentful's App SDK, let us know: https://github.com/contentful/ui-extensions-sdk/issues");
+        }, DELAY_TIMEOUT);
+        (0, app_sdk_1.init)(function (sdk) {
+            setSDK(sdk);
+            window.clearTimeout(timeout);
+        });
+        return function () { return window.clearTimeout(timeout); };
     }, []);
     if (!sdk) {
         if (props.loading) {

package/dist/SDKProvider.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/SDKProvider.spec.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("@testing-library/react");
+var SDKProvider_1 = require("./SDKProvider");
+var app_sdk_1 = require("@contentful/app-sdk");
+jest.useFakeTimers();
+jest.mock('@contentful/app-sdk', function () { return ({
+    init: jest.fn(),
+}); });
+describe('SDKProvider', function () {
+    var consoleWarnMock;
+    beforeEach(function () {
+        // @ts-ignore
+        app_sdk_1.init.mockImplementation(function (callback) {
+            callback({});
+        });
+        consoleWarnMock = jest.spyOn(console, 'warn').mockImplementation();
+    });
+    afterEach(function () {
+        consoleWarnMock === null || consoleWarnMock === void 0 ? void 0 : consoleWarnMock.mockRestore();
+    });
+    it('renders its children when sdk the init returns the sdk', function () {
+        var getByText = (0, react_1.render)((0, jsx_runtime_1.jsx)(SDKProvider_1.SDKProvider, { children: (0, jsx_runtime_1.jsx)("div", { children: "children" }) })).getByText;
+        expect(getByText('children')).toBeTruthy();
+    });
+    it('calls console warn after timeout if callback is not returning ', function () {
+        // @ts-ignore
+        app_sdk_1.init.mockImplementation(function () { });
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(SDKProvider_1.SDKProvider, { children: (0, jsx_runtime_1.jsx)("div", { children: "children" }) }));
+        jest.runAllTimers();
+        expect(consoleWarnMock).toHaveBeenCalled();
+    });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/react-apps-toolkit",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "description": "Toolkit for building a Contentful app in React",
   "keywords": [],
   "author": "Contentful GmbH",
@@ -48,5 +48,5 @@
   "dependencies": {
     "@contentful/app-sdk": "^4.0.0"
   },
-  "gitHead": "97a40b53cd03af999d289ac3e40ae90149d9c92a"
+  "gitHead": "8de11c51bc4d238157b026236e1b5bf62e227058"
 }