Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: Custom widget crashes in the builder, unrecoverable - cannot edit in builder #37210

Open
1 task done
japrogramer opened this issue Nov 4, 2024 · 0 comments
Open
1 task done
Assignees
Labels
Bug Something isn't working Community Reported issues reported by community members Custom Widgets For all issues related to the custom widget project High This issue blocks a user from building or impacts a lot of users Needs Triaging Needs attention from maintainers to triage Production Widgets & Accelerators Pod Issues related to widgets & Accelerators Widgets Product This label groups issues related to widgets

Comments

@japrogramer
Copy link

Is there an existing issue for this?

  • I have searched the existing issues

Description

I was adding an html tag <div className="join> in a custom widget as a paste and before I could close the tag the app crashed.

message
: 
"Invalid regular expression: /\\bimport\\b\\ \\bRe
stack
: 
"SyntaxError: Invalid regular expression: /\\bimpo

{
    "error": {},
    "errorInfo": {
        "componentStack": "\n    at t (https://google.com.com/static/js/9318.84ea6ef8.chunk.js:1:33709)\n    at S (https://google.com.com/static/js/main.04246694.js:2:6637063)\n    at t (https://google.com.com/static/js/main.04246694.js:2:5458000)\n    at profiler(Connect(t))\n    at div\n    at A (https://google.com.com/static/js/main.04246694.js:2:6921824)\n    at V (https://google.com.com/static/js/main.04246694.js:2:2616040)\n    at div\n    at Ke (https://google.com.com/static/js/CustomWidgetBuilder.d9d4bc4e.chunk.js:1:30244)\n    at div\n    at https://google.com.com/static/js/main.04246694.js:2:5319968\n    at s (https://google.com.com/static/js/main.04246694.js:2:5317911)\n    at https://google.com.com/static/js/main.04246694.js:2:429312\n    at A (https://google.com.com/static/js/main.04246694.js:2:6921824)\n    at ge (https://google.com.com/static/js/main.04246694.js:2:433498)\n    at div\n    at https://google.com.com/static/js/main.04246694.js:2:5319968\n    at c (https://google.com.com/static/js/main.04246694.js:2:5306802)\n    at https://google.com.com/static/js/main.04246694.js:2:427689\n    at A (https://google.com.com/static/js/main.04246694.js:2:6921824)\n    at he (https://google.com.com/static/js/main.04246694.js:2:432862)\n    at div\n    at le (https://google.com.com/static/js/CustomWidgetBuilder.d9d4bc4e.chunk.js:1:11498)\n    at div\n    at ye (https://google.com.com/static/js/CustomWidgetBuilder.d9d4bc4e.chunk.js:1:14523)\n    at div\n    at div\n    at an (https://google.com.com/static/js/CustomWidgetBuilder.d9d4bc4e.chunk.js:1:36174)\n    at div\n    at div\n    at Cn (https://google.com.com/static/js/CustomWidgetBuilder.d9d4bc4e.chunk.js:1:41450)\n    at t (https://google.com.com/static/js/main.04246694.js:2:2901543)\n    at t (https://google.com.com/static/js/main.04246694.js:2:6680462)\n    at sentryRoute(t)\n    at t (https://google.com.com/static/js/main.04246694.js:2:6681379)\n    at Hl (https://google.com.com/static/js/main.04246694.js:2:2902216)\n    at Al (https://google.com.com/static/js/main.04246694.js:2:2898299)\n    at Suspense\n    at t (https://google.com.com/static/js/main.04246694.js:2:6677791)\n    at jl (https://google.com.com/static/js/main.04246694.js:2:2903501)\n    at i (https://google.com.com/static/js/main.04246694.js:2:7845363)\n    at Ne (https://google.com.com/static/js/main.04246694.js:2:6919913)\n    at i (https://google.com.com/static/js/main.04246694.js:2:7857468)\n    at S (https://google.com.com/static/js/main.04246694.js:2:6637063)\n    at l (https://google.com.com/static/js/main.04246694.js:2:6635140)\n    at t (https://google.com.com/static/js/main.04246694.js:2:5452879)\n    at ya"
    }
}

to fix it I had to export the app and edited the tag out from the json file. which by the way seems to be in two places even tho I only added it once, by that I mean the whole js script was duplicated in two places in the json. after removing the tag importing the app worked.

Steps To Reproduce

<!-- no need to write html, head, body tags, it is handled by the widget -->
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.12.14/dist/full.css" rel="stylesheet" type="text/css" />
<div id="root">
	Loading ...
</div>

I havent been able to create an insulated error test case

but I do some unusual things that may help

import React, {useState, useEffect, useRef}
from 'https://cdn.jsdelivr.net/npm/react@18.2.0/+esm'
import reactDom from
'https://cdn.jsdelivr.net/npm/react-dom@18.2.0/+esm'
import { Button, Card } from 
'https://cdn.jsdelivr.net/npm/antd@5.11.1/+esm'
import  Markdown from 
'https://cdn.jsdelivr.net/npm/react-markdown@9.0.1/+esm';
import { HiThumbUp, HiThumbDown, HiBookmark, HiPrinter, HiPencil, HiTrash,
			 HiOutlineAnnotation
			 } from 'https://cdn.jsdelivr.net/npm/react-icons@4.11.0/hi/+esm';

function App() {
	const [currentIndex, setCurrentIndex] = React.useState(0);

	const handleNext = () => {
		setCurrentIndex((prevIndex) => (prevIndex + 1) % appsmith.model.tips.length);
	};
	const handeNext = () => {
		setCurrentIndex((prevIndex) => (prevIndex + 1) % appsmith.model.tips.length);
	};

	

	const handleReset = () => {
		setCurrentIndex(0);
		appsmith.triggerEvent("onResetClick");
	};

	return (
		<Card>
				<div className="button-container">
				<Button className="primary" onClick={handleNext} type="primary">Next Tip</Button>
				<Button className="reset" disabled={currentIndex === 0} onClick={handleReset}>Reset</Button>
			</div>
	</Card>
);
}

appsmith.onReady(() => {  
  const resetAPP = () => {
    appsmith.triggerEvent("ResetUI")  
    reactDom.render(<App />, document.getElementById("root"));
  }

  const handle_loop = setInterval(function() {
    resetAPP();
  }, 500);
   
  reactDom.render(<App />, document.getElementById("root"));
});

Public Sample App

No response

Environment

Production

Severity

Critical (Broken Production apps)

Issue video log

No response

Version

release

@japrogramer japrogramer added Bug Something isn't working Needs Triaging Needs attention from maintainers to triage labels Nov 4, 2024
@Nikhil-Nandagopal Nikhil-Nandagopal added Community Reported issues reported by community members Critical This issue needs immediate attention. Drop everything else Production High This issue blocks a user from building or impacts a lot of users Custom Widgets For all issues related to the custom widget project and removed Critical This issue needs immediate attention. Drop everything else labels Nov 4, 2024
@github-actions github-actions bot added Widgets Product This label groups issues related to widgets Widgets & Accelerators Pod Issues related to widgets & Accelerators labels Nov 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug Something isn't working Community Reported issues reported by community members Custom Widgets For all issues related to the custom widget project High This issue blocks a user from building or impacts a lot of users Needs Triaging Needs attention from maintainers to triage Production Widgets & Accelerators Pod Issues related to widgets & Accelerators Widgets Product This label groups issues related to widgets
Projects
None yet
Development

No branches or pull requests

6 participants