diff --git a/cypress/integration/loadSite.spec.ts b/cypress/integration/loadSite.spec.ts
index b082859f..550e30c8 100644
--- a/cypress/integration/loadSite.spec.ts
+++ b/cypress/integration/loadSite.spec.ts
@@ -17,9 +17,8 @@ describe('Site Loads', () => {
);
cy.url().should(
'include',
- '/edit/eyJjb2RlIjoiZ3JhcGggVERcbiAgICBBW0NocmlzdG1hc10gLS0-fEdldCBtb25leXwgQihHbyBzaG9wcGluZylcbiAgICBCIC0tPiBDe0xldCBtZSB0aGlua31cbiAgICBDIC0tPnxPbmV8IERbTGFwdG9wXVxuICAgIEMgLS0-fFR3b3wgRVtpUGhvbmVdXG4gICAgQyAtLT58VGhyZWV8IEZbZmE6ZmEtY2FyIENhcl0iLCJtZXJtYWlkIjp7InRoZW1lIjoiZGVmYXVsdCJ9LCJ1cGRhdGVFZGl0b3IiOmZhbHNlfQ'
+ '/edit#eyJjb2RlIjoiZ3JhcGggVERcbiAgICBBW0NocmlzdG1hc10gLS0-fEdldCBtb25leXwgQihHbyBzaG9wcGluZylcbiAgICBCIC0tPiBDe0xldCBtZSB0aGlua31cbiAgICBDIC0tPnxPbmV8IERbTGFwdG9wXVxuICAgIEMgLS0-fFR3b3wgRVtpUGhvbmVdXG4gICAgQyAtLT58VGhyZWV8IEZbZmE6ZmEtY2FyIENhcl0iLCJtZXJtYWlkIjp7InRoZW1lIjoiZGVmYXVsdCJ9LCJ1cGRhdGVFZGl0b3IiOmZhbHNlfQ'
);
-
cy.contains('History').click();
cy.getLocalStorage('codeStore').snapshot();
});
@@ -88,4 +87,9 @@ describe('Site Loads', () => {
cy.contains('securityLevel');
cy.get('#view').find('img').should('be.visible');
});
+
+ it('should show troubleshooting steps if loading fails', () => {
+ cy.visit('/#/edit/eyJjb2RlIjoiZ3JhcGggVERcbiAg');
+ cy.contains('Please Click here to Raise an issue in github.');
+ });
});
diff --git a/cypress/snapshots.js b/cypress/snapshots.js
index ef681857..6f6a02aa 100644
--- a/cypress/snapshots.js
+++ b/cypress/snapshots.js
@@ -16,7 +16,7 @@ module.exports = {
"1": "{\"code\":\"graph TD\\n A[Party] -->|Get money| B(Go shopping!!)\\n \",\"mermaid\":\"{\\n \\\"theme\\\": \\\"forest\\\",\\n \\\"test\\\": \\\"hello world\\\"\\n}\",\"updateEditor\":false,\"autoSync\":true,\"updateDiagram\":true,\"loader\":{\"type\":\"files\",\"config\":{\"codeURL\":\"https://gist.githubusercontent.com/sidharthv96/6268a23e673a533dcb198f241fd7012a/raw/4eb03887e6a41397e80bdcdbf94017c498f8f1e2/code.mmd\",\"configURL\":\"https://gist.githubusercontent.com/sidharthv96/6268a23e673a533dcb198f241fd7012a/raw/4eb03887e6a41397e80bdcdbf94017c498f8f1e2/config.json\"}}}"
}
},
- "__version": "8.4.1",
+ "__version": "8.5.0",
"Auto sync tests": {
"should dim diagram when code is edited": {
"1": "{\"code\":\"graph TD\\n A[Christmas] -->|Get money| B(Go shopping)\\n B --> C{Let me think}\\n C -->|One| D[Laptop]\\n C -->|Two| E[iPhone]\\n C -->|Three| F[fa:fa-car Car]\\n C --> Test\",\"mermaid\":\"{\\n \\\"theme\\\": \\\"default\\\"\\n}\",\"updateEditor\":false,\"autoSync\":false,\"updateDiagram\":false}"
diff --git a/src/lib/util/state.ts b/src/lib/util/state.ts
index 5688493f..7d359908 100644
--- a/src/lib/util/state.ts
+++ b/src/lib/util/state.ts
@@ -25,6 +25,17 @@ export const defaultState: State = {
updateDiagram: true
};
+const urlParseFailedState = `graph TD
+ A[Loading URL failed. We can try to figure out why.] -->|Decode JSON| B(Please check the console to see the JSON and error details.)
+ B --> C{Is the JSON correct?}
+ C -->|Yes| D(Please Click here to Raise an issue in github.
Including the broken link in the issue
will speed up the fix.)
+ C -->|No| E{Did someone
send you this link?}
+ E -->|Yes| F[Ask them to send
you the complete link]
+ E -->|No| G{Did you copy
the complete URL?}
+ G --> |Yes| D
+ G --> |"No :("| H(Try using the Timeline tab in History
from same browser you used to create the diagram.)
+ click D href "https://github.com/mermaid-js/mermaid-live-editor/issues/new?assignees=&labels=bug&template=bug_report.md&title=Broken%20link" "Raise issue"`;
+
export const codeStore = persist(writable(defaultState), localStorage(), 'codeStore');
export const base64State: Readable = derived([codeStore], ([code], set) => {
set(toBase64(JSON.stringify(code), true));
@@ -50,11 +61,11 @@ export const loadState = (data: string): void => {
state.mermaid = JSON.stringify(mermaidConfig, null, 2);
} catch (e) {
+ state = get(codeStore);
if (data) {
console.error('Init error', e);
+ state.code = urlParseFailedState;
}
- state = get(codeStore);
- console.log(state);
}
updateCodeStore({ ...state, updateEditor: true });
};