covalent: Editor is not shown in Electron
I had the same error as here: https://github.com/Teradata/covalent-code-editor/issues/22 I followed the instructions and the error is gone, however the editor is still not displayed.
<td-code-editor _ngcontent-c1="" automaticlayout="" id="editWindow" _nghost-c4="" ng-reflect-language="mcscript" ng-reflect-theme="mcfunction" ng-reflect-automatic-layout="" class="ng-untouched ng-valid ng-dirty" style="display: block;" ng-reflect-model="">
<div _ngcontent-c4="" class="editorContainer">
<webview nodeintegration="true" disablewebsecurity="true" src="data:text/html;base64,PCFET0NUWVBFIGh0bWw+CiAgICAgICAgICAgIDxodG1sIHN0eWxlPSJoZWlnaHQ6MTAwJSI+CiAgICAgICAgICAgIDxoZWFkPgogICAgICAgICAgICAgICAgPG1ldGEgaHR0cC1lcXVpdj0iWC1VQS1Db21wYXRpYmxlIiBjb250ZW50PSJJRT1lZGdlIiAvPgogICAgICAgICAgICAgICAgPG1ldGEgaHR0cC1lcXVpdj0iQ29udGVudC1UeXBlIiBjb250ZW50PSJ0ZXh0L2h0bWw7Y2hhcnNldD11dGYtOCIgPgogICAgICAgICAgICAgICAgPGxpbmsgcmVsPSJzdHlsZXNoZWV0IiBkYXRhLW5hbWU9InZzL2VkaXRvci9lZGl0b3IubWFpbiIKICAgICAgICAgICAgICAgICAgICBocmVmPSJmaWxlOi8vL2Fzc2V0cy9tb25hY28vdnMvZWRpdG9yL2VkaXRvci5tYWluLmNzcyI+CiAgICAgICAgICAgIDwvaGVhZD4KICAgICAgICAgICAgPGJvZHkgc3R5bGU9ImhlaWdodDoxMDAlO3dpZHRoOiAxMDAlO21hcmdpbjogMDtwYWRkaW5nOiAwO292ZXJmbG93OiBoaWRkZW47Ij4KICAgICAgICAgICAgPGRpdiBpZD0iZWRpdG9ySW5uZXJDb250YWluZXIwIiBzdHlsZT0id2lkdGg6MTAwJTtoZWlnaHQ6MTAwJTt3aWR0aDoxMDAlO2hlaWdodDoxMDAlO2JvcmRlcjoxcHggc29saWQgZ3JleTsiPjwvZGl2PgogICAgICAgICAgICA8c2NyaXB0PgogICAgICAgICAgICAgICAgLy8gR2V0IHRoZSBpcGNSZW5kZXJlciBvZiBlbGVjdHJvbiBmb3IgY29tbXVuaWNhdGlvbgogICAgICAgICAgICAgICAgY29uc3Qge2lwY1JlbmRlcmVyfSA9IHJlcXVpcmUoJ2VsZWN0cm9uJyk7CiAgICAgICAgICAgIDwvc2NyaXB0PgogICAgICAgICAgICA8c2NyaXB0IHNyYz0iZmlsZTovLy9hc3NldHMvbW9uYWNvL3ZzL2xvYWRlci5qcyI+PC9zY3JpcHQ+CiAgICAgICAgICAgIDxzY3JpcHQ+CiAgICAgICAgICAgICAgICB2YXIgZWRpdG9yOwogICAgICAgICAgICAgICAgdmFyIHRoZW1lID0gJ21jZnVuY3Rpb24nOwogICAgICAgICAgICAgICAgdmFyIHZhbHVlID0gJyc7CiAgICAgICAgICAgICAgICByZXF1aXJlLmNvbmZpZyh7CiAgICAgICAgICAgICAgICAgICAgYmFzZVVybDogJ0M6L3dlYmRldi9hbmd1bGFyIDQvbWNzRWRpdG9yL2Fzc2V0cy9tb25hY28nCiAgICAgICAgICAgICAgICB9KTsKICAgICAgICAgICAgICAgIHNlbGYubW9kdWxlID0gdW5kZWZpbmVkOwogICAgICAgICAgICAgICAgc2VsZi5wcm9jZXNzLmJyb3dzZXIgPSB0cnVlOwogICAgICAgICAgICAgICAgcmVxdWlyZShbJ3ZzL2VkaXRvci9lZGl0b3IubWFpbiddLCBmdW5jdGlvbigpIHsKICAgICAgICAgICAgICAgICAgICBlZGl0b3IgPSBtb25hY28uZWRpdG9yLmNyZWF0ZShkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnZWRpdG9ySW5uZXJDb250YWluZXIwJyksIE9iamVjdC5hc3NpZ24oewogICAgICAgICAgICAgICAgICAgICAgICB2YWx1ZTogdmFsdWUsCiAgICAgICAgICAgICAgICAgICAgICAgIGxhbmd1YWdlOiAnbWNzY3JpcHQnLAogICAgICAgICAgICAgICAgICAgICAgICB0aGVtZTogJ21jZnVuY3Rpb24nLAogICAgICAgICAgICAgICAgICAgIH0sIHt9KSk7CiAgICAgICAgICAgICAgICAgICAgZWRpdG9yLmdldE1vZGVsKCkub25EaWRDaGFuZ2VDb250ZW50KCAoZSk9PiB7CiAgICAgICAgICAgICAgICAgICAgICAgIGlwY1JlbmRlcmVyLnNlbmRUb0hvc3QoIm9uRWRpdG9yQ29udGVudENoYW5nZSIsIGVkaXRvci5nZXRWYWx1ZSgpKTsKICAgICAgICAgICAgICAgICAgICB9KTsKICAgICAgICAgICAgICAgICAgICBpcGNSZW5kZXJlci5zZW5kVG9Ib3N0KCJvbkVkaXRvckluaXRpYWxpemVkIiwgJycpOwogICAgICAgICAgICAgICAgfSk7CiAgICAgICAgICAgICAgICAvLyByZXR1cm4gYmFjayB0aGUgdmFsdWUgaW4gdGhlIGVkaXRvciB0byB0aGUgbWFpbnZpZXcKICAgICAgICAgICAgICAgIGlwY1JlbmRlcmVyLm9uKCdnZXRFZGl0b3JDb250ZW50JywgZnVuY3Rpb24oKXsKICAgICAgICAgICAgICAgICAgICBpcGNSZW5kZXJlci5zZW5kVG9Ib3N0KCJlZGl0b3JDb250ZW50IiwgZWRpdG9yLmdldFZhbHVlKCkpOwogICAgICAgICAgICAgICAgfSk7CiAgICAgICAgICAgICAgICAvLyBzZXQgdGhlIHZhbHVlIG9mIHRoZSBlZGl0b3IgZnJvbSB3aGF0IHdhcyBzZW50IGZyb20gdGhlIG1haW52aWV3CiAgICAgICAgICAgICAgICBpcGNSZW5kZXJlci5vbignc2V0RWRpdG9yQ29udGVudCcsIGZ1bmN0aW9uKGV2ZW50LCBkYXRhKXsKICAgICAgICAgICAgICAgICAgICB2YWx1ZSA9IGRhdGE7CiAgICAgICAgICAgICAgICAgICAgZWRpdG9yLnNldFZhbHVlKGRhdGEpOwogICAgICAgICAgICAgICAgfSk7CiAgICAgICAgICAgICAgICAvLyBzZXQgdGhlIHN0eWxlIG9mIHRoZSBlZGl0b3IgY29udGFpbmVyIGRpdgogICAgICAgICAgICAgICAgaXBjUmVuZGVyZXIub24oJ3NldEVkaXRvclN0eWxlJywgZnVuY3Rpb24oZXZlbnQsIGRhdGEpewogICAgICAgICAgICAgICAgICAgIHZhciBlZGl0b3JEaXYgPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnZWRpdG9ySW5uZXJDb250YWluZXIwJyk7CiAgICAgICAgICAgICAgICAgICAgZWRpdG9yRGl2LnN0eWxlID0gZGF0YS5zdHlsZTsKICAgICAgICAgICAgICAgICAgICB2YXIgY3VycmVudFZhbHVlID0gZWRpdG9yLmdldFZhbHVlKCk7CiAgICAgICAgICAgICAgICAgICAgZWRpdG9yLmRpc3Bvc2UoKTsKICAgICAgICAgICAgICAgICAgICBlZGl0b3IgPSBtb25hY28uZWRpdG9yLmNyZWF0ZShkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnZWRpdG9ySW5uZXJDb250YWluZXIwJyksIE9iamVjdC5hc3NpZ24oewogICAgICAgICAgICAgICAgICAgICAgICB2YWx1ZTogY3VycmVudFZhbHVlLAogICAgICAgICAgICAgICAgICAgICAgICBsYW5ndWFnZTogZGF0YS5sYW5ndWFnZSwKICAgICAgICAgICAgICAgICAgICAgICAgdGhlbWU6IGRhdGEudGhlbWUsCiAgICAgICAgICAgICAgICAgICAgfSwge30pKTsKICAgICAgICAgICAgICAgIH0pOwogICAgICAgICAgICAgICAgLy8gc2V0IHRoZSBvcHRpb25zIG9mIHRoZSBlZGl0b3IgZnJvbSB3aGF0IHdhcyBzZW50IGZyb20gdGhlIG1haW52aWV3CiAgICAgICAgICAgICAgICBpcGNSZW5kZXJlci5vbignc2V0RWRpdG9yT3B0aW9ucycsIGZ1bmN0aW9uKGV2ZW50LCBkYXRhKXsKICAgICAgICAgICAgICAgICAgICBlZGl0b3IudXBkYXRlT3B0aW9ucyhkYXRhKTsKICAgICAgICAgICAgICAgICAgICBpcGNSZW5kZXJlci5zZW5kVG9Ib3N0KCJvbkVkaXRvckNvbmZpZ3VyYXRpb25DaGFuZ2VkIiwgJycpOwogICAgICAgICAgICAgICAgfSk7CiAgICAgICAgICAgICAgICAvLyBzZXQgdGhlIGxhbmd1YWdlIG9mIHRoZSBlZGl0b3IgZnJvbSB3aGF0IHdhcyBzZW50IGZyb20gdGhlIG1haW52aWV3CiAgICAgICAgICAgICAgICBpcGNSZW5kZXJlci5vbignc2V0TGFuZ3VhZ2UnLCBmdW5jdGlvbihldmVudCwgZGF0YSl7CiAgICAgICAgICAgICAgICAgICAgdmFyIGN1cnJlbnRWYWx1ZSA9IGVkaXRvci5nZXRWYWx1ZSgpOwogICAgICAgICAgICAgICAgICAgIGVkaXRvci5kaXNwb3NlKCk7CiAgICAgICAgICAgICAgICAgICAgZWRpdG9yID0gbW9uYWNvLmVkaXRvci5jcmVhdGUoZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2VkaXRvcklubmVyQ29udGFpbmVyMCcpLCBPYmplY3QuYXNzaWduKHsKICAgICAgICAgICAgICAgICAgICAgICAgdmFsdWU6IGN1cnJlbnRWYWx1ZSwKICAgICAgICAgICAgICAgICAgICAgICAgbGFuZ3VhZ2U6IGRhdGEsCiAgICAgICAgICAgICAgICAgICAgICAgIHRoZW1lOiB0aGVtZSwKICAgICAgICAgICAgICAgICAgICB9LCB7fSkpOwogICAgICAgICAgICAgICAgICAgIGlwY1JlbmRlcmVyLnNlbmRUb0hvc3QoIm9uRWRpdG9yQ29uZmlndXJhdGlvbkNoYW5nZWQiLCAnJyk7CiAgICAgICAgICAgICAgICAgICAgaXBjUmVuZGVyZXIuc2VuZFRvSG9zdCgib25FZGl0b3JMYW5ndWFnZUNoYW5nZWQiLCAnJyk7CiAgICAgICAgICAgICAgICB9KTsKICAgICAgICAgICAgICAgIC8vIHJlZ2lzdGVyIGEgbmV3IGxhbmd1YWdlIHdpdGggZWRpdG9yCiAgICAgICAgICAgICAgICBpcGNSZW5kZXJlci5vbigncmVnaXN0ZXJMYW5ndWFnZScsIGZ1bmN0aW9uKGV2ZW50LCBkYXRhKXsKICAgICAgICAgICAgICAgICAgICB2YXIgY3VycmVudFZhbHVlID0gZWRpdG9yLmdldFZhbHVlKCk7CiAgICAgICAgICAgICAgICAgICAgZWRpdG9yLmRpc3Bvc2UoKTsKICAgICAgICAgICAgICAgICAgICBmb3IgKHZhciBpID0gMDsgaSA8IGRhdGEuY29tcGxldGlvbkl0ZW1Qcm92aWRlci5sZW5ndGg7IGkrKykgewogICAgICAgICAgICAgICAgICAgICAgICB2YXIgcHJvdmlkZXIgPSBkYXRhLmNvbXBsZXRpb25JdGVtUHJvdmlkZXJbaV07CiAgICAgICAgICAgICAgICAgICAgICAgIHByb3ZpZGVyLmtpbmQgPSBldmFsKHByb3ZpZGVyLmtpbmQpOwogICAgICAgICAgICAgICAgICAgIH0KICAgICAgICAgICAgICAgICAgICBmb3IgKHZhciBpID0gMDsgaSA8IGRhdGEubW9uYXJjaFRva2Vuc1Byb3ZpZGVyLmxlbmd0aDsgaSsrKSB7CiAgICAgICAgICAgICAgICAgICAgICAgIHZhciBtb25hcmNoVG9rZW5zID0gZGF0YS5tb25hcmNoVG9rZW5zUHJvdmlkZXJbaV07CiAgICAgICAgICAgICAgICAgICAgICAgIG1vbmFyY2hUb2tlbnNbMF0gPSBldmFsKG1vbmFyY2hUb2tlbnNbMF0pOwogICAgICAgICAgICAgICAgICAgIH0KICAgICAgICAgICAgICAgICAgICBtb25hY28ubGFuZ3VhZ2VzLnJlZ2lzdGVyKHsgaWQ6IGRhdGEuaWQgfSk7CiAgICAgICAgICAgICAgICAgICAgbW9uYWNvLmxhbmd1YWdlcy5zZXRNb25hcmNoVG9rZW5zUHJvdmlkZXIoZGF0YS5pZCwgewogICAgICAgICAgICAgICAgICAgICAgICB0b2tlbml6ZXI6IHsKICAgICAgICAgICAgICAgICAgICAgICAgICAgIHJvb3Q6IGRhdGEubW9uYXJjaFRva2Vuc1Byb3ZpZGVyCiAgICAgICAgICAgICAgICAgICAgICAgIH0KICAgICAgICAgICAgICAgICAgICB9KTsKICAgICAgICAgICAgICAgICAgICAvLyBEZWZpbmUgYSBuZXcgdGhlbWUgdGhhdCBjb25zdGFpbnMgb25seSBydWxlcyB0aGF0IG1hdGNoIHRoaXMgbGFuZ3VhZ2UKICAgICAgICAgICAgICAgICAgICBtb25hY28uZWRpdG9yLmRlZmluZVRoZW1lKGRhdGEuY3VzdG9tVGhlbWUuaWQsIGRhdGEuY3VzdG9tVGhlbWUudGhlbWUpOwogICAgICAgICAgICAgICAgICAgIHRoZW1lID0gZGF0YS5jdXN0b21UaGVtZS5pZDsKICAgICAgICAgICAgICAgICAgICBtb25hY28ubGFuZ3VhZ2VzLnJlZ2lzdGVyQ29tcGxldGlvbkl0ZW1Qcm92aWRlcihkYXRhLmlkLCB7CiAgICAgICAgICAgICAgICAgICAgICAgIHByb3ZpZGVDb21wbGV0aW9uSXRlbXM6ICgpID0+IHsKICAgICAgICAgICAgICAgICAgICAgICAgICAgIHJldHVybiBkYXRhLmNvbXBsZXRpb25JdGVtUHJvdmlkZXIKICAgICAgICAgICAgICAgICAgICAgICAgfQogICAgICAgICAgICAgICAgICAgIH0pOwogICAgICAgICAgICAgICAgICAgIHZhciBjc3MgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCJzdHlsZSIpOwogICAgICAgICAgICAgICAgICAgIGNzcy50eXBlID0gInRleHQvY3NzIjsKICAgICAgICAgICAgICAgICAgICBjc3MuaW5uZXJIVE1MID0gZGF0YS5tb25hcmNoVG9rZW5zUHJvdmlkZXJDU1M7CiAgICAgICAgICAgICAgICAgICAgZG9jdW1lbnQuYm9keS5hcHBlbmRDaGlsZChjc3MpOwogICAgICAgICAgICAgICAgICAgIGlwY1JlbmRlcmVyLnNlbmRUb0hvc3QoIm9uRWRpdG9yQ29uZmlndXJhdGlvbkNoYW5nZWQiLCAnJyk7CiAgICAgICAgICAgICAgICB9KTsKICAgICAgICAgICAgICAgIC8vIEluc3RydWN0IHRoZSBlZGl0b3IgdG8gcmVtZWFzdXJlIGl0cyBjb250YWluZXIKICAgICAgICAgICAgICAgIGlwY1JlbmRlcmVyLm9uKCdsYXlvdXQnLCBmdW5jdGlvbigpewogICAgICAgICAgICAgICAgICAgIGVkaXRvci5sYXlvdXQoKTsKICAgICAgICAgICAgICAgIH0pOwogICAgICAgICAgICAgICAgLy8gbmVlZCB0byBtYW51YWxseSByZXNpemUgdGhlIGVkaXRvciBhbnkgdGltZSB0aGUgd2luZG93IHNpemUKICAgICAgICAgICAgICAgIC8vIGNoYW5nZXMuIFNlZTogaHR0cHM6Ly9naXRodWIuY29tL01pY3Jvc29mdC9tb25hY28tZWRpdG9yL2lzc3Vlcy8yOAogICAgICAgICAgICAgICAgd2luZG93LmFkZEV2ZW50TGlzdGVuZXIoInJlc2l6ZSIsIGZ1bmN0aW9uIHJlc2l6ZUVkaXRvcigpIHsKICAgICAgICAgICAgICAgICAgICBlZGl0b3IubGF5b3V0KCk7CiAgICAgICAgICAgICAgICB9KTsKICAgICAgICAgICAgPC9zY3JpcHQ+CiAgICAgICAgICAgIDwvYm9keT4KICAgICAgICAgICAgPC9odG1sPg==" style="display:inline-flex; width:100%; height:100%" tabindex="-1" guestinstance="4">
</webview>
</div>
</td-code-editor>
But the webview with the base64 string is loaded. In the browser it works perfectly.
I don“t know what I am doing wrong here(I also specify a custom language on the component)
in my source html:
<td-code-editor (keydown)="test($event)" [style.display]="(selectedTab || selectedTab.content != '\t\r') ? 'block' : 'none' " [theme]="editorOptions.theme" automaticLayout [language]="editorOptions.language" [(ngModel)]="selectedTab.content" id="editWindow" #editWindow></td-code-editor>
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Comments: 29
select
<webview>tag in elements tab and enter $0.openDevtools() in console. Now you will see a new devtool window and the errors of embedded code editor.