Skip to content

Commit d178ec8

Browse files
hsy822hsy822
committed
quickdappv2 e2e tests
1 parent 69e3740 commit d178ec8

File tree

9 files changed

+756
-31
lines changed

9 files changed

+756
-31
lines changed

‎.circleci/config.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ parameters:
1414
default: ""
1515
run_file_tests_keyword:
1616
type: enum
17-
enum: ["", "ai_panel", "ai_tool_selector", "ballot", "ballot_0_4_14", "blockchain", "bottom-bar", "circom", "code_format", "compile_run_widget", "compiler_api", "contract_flattener", "contract_verification", "debugger", "defaultLayout", "deploy_vefiry", "dgit_github", "dgit_local", "editor", "editorGoToDefinition", "editorHoverContext", "editorReferences", "editor_autocomplete", "editor_error_marker", "editor_line_text", "eip1153", "eip7702", "environment-account", "erc721", "etherscan_api", "expandAllFolders", "fileExplorer", "fileManager_api", "file_decorator", "file_explorer_context_menu", "file_explorer_dragdrop", "file_explorer_multiselect", "generalSettings", "gist", "homeTab", "importFromGithub", "importResolver", "layout", "learneth", "libraryDeployment", "matomo-bot-detection", "matomo-consent", "maximizePanels", "mcp_all_resources", "mcp_compilation_tools", "mcp_debugging_tools", "mcp_deployment_tools", "mcp_file_management_tools", "mcp_file_permissions", "mcp_integration_workflows", "mcp_misc_tools", "mcp_resource_providers", "mcp_security_middleware", "mcp_server_complete", "mcp_server_connection", "mcp_server_lifecycle", "metamask", "migrateFileSystem", "noir", "pinned_contracts", "pluginManager", "plugin_api", "providers", "proxy_oz_v4", "proxy_oz_v5", "proxy_oz_v5_non_shanghai_runtime", "publishContract", "quickDapp_metamask", "recorder", "remixd", "runAndDeploy", "script-runner", "search", "signingMessage", "sol2uml", "solidityImport", "solidityUnittests", "specialFunctions", "staticAnalysis", "stressEditor", "template_exp_modal", "terminal", "toggle_panels", "transaction-simulator", "transactionExecution", "txListener", "uniswap_v4_core", "url", "usingWebWorker", "verticalIconsPanel", "vm_state", "vyper_api", "walkthrough", "workspace", "workspace_git"]
17+
enum: ["", "ai_panel", "ai_tool_selector", "ballot", "ballot_0_4_14", "blockchain", "bottom-bar", "circom", "code_format", "compile_run_widget", "compiler_api", "contract_flattener", "contract_verification", "debugger", "defaultLayout", "deploy_vefiry", "dgit_github", "dgit_local", "editor", "editorGoToDefinition", "editorHoverContext", "editorReferences", "editor_autocomplete", "editor_error_marker", "editor_line_text", "eip1153", "eip7702", "environment-account", "erc721", "etherscan_api", "expandAllFolders", "fileExplorer", "fileManager_api", "file_decorator", "file_explorer_context_menu", "file_explorer_dragdrop", "file_explorer_multiselect", "generalSettings", "gist", "homeTab", "importFromGithub", "importResolver", "layout", "learneth", "libraryDeployment", "matomo-bot-detection", "matomo-consent", "maximizePanels", "mcp_all_resources", "mcp_compilation_tools", "mcp_debugging_tools", "mcp_deployment_tools", "mcp_file_management_tools", "mcp_file_permissions", "mcp_integration_workflows", "mcp_misc_tools", "mcp_resource_providers", "mcp_security_middleware", "mcp_server_complete", "mcp_server_connection", "mcp_server_lifecycle", "metamask", "migrateFileSystem", "noir", "pinned_contracts", "pluginManager", "plugin_api", "providers", "proxy_oz_v4", "proxy_oz_v5", "proxy_oz_v5_non_shanghai_runtime", "publishContract", "quickDapp_metamask", "quickDapp_v2", "recorder", "remixd", "runAndDeploy", "script-runner", "search", "signingMessage", "sol2uml", "solidityImport", "solidityUnittests", "specialFunctions", "staticAnalysis", "stressEditor", "template_exp_modal", "terminal", "toggle_panels", "transaction-simulator", "transactionExecution", "txListener", "uniswap_v4_core", "url", "usingWebWorker", "verticalIconsPanel", "vm_state", "vyper_api", "walkthrough", "workspace", "workspace_git"]
1818
default: ""
1919
run_flaky_tests:
2020
type: boolean

‎apps/remix-ide-e2e/src/tests/quickDapp_v2.test.ts‎

Lines changed: 714 additions & 0 deletions
Large diffs are not rendered by default.

‎libs/remix-ui/quick-dapp-v2/src/lib/components/ChatBox/index.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,6 +126,7 @@ const ChatBox: React.FC<ChatBoxProps> = ({ onSendMessage, isLoading }) => {
126126
onClick={() => fileInputRef.current?.click()}
127127
title="Attach image (Screenshot, Mockup)"
128128
disabled={isLoading}
129+
data-id="chat-attach-btn"
129130
>
130131
<i className="fas fa-paperclip"></i>
131132
</Button>
@@ -143,13 +144,15 @@ const ChatBox: React.FC<ChatBoxProps> = ({ onSendMessage, isLoading }) => {
143144
disabled={isLoading}
144145
className="chat-input flex-grow-1 mx-2"
145146
style={{ resize: 'none' }}
147+
data-id="chat-input"
146148
/>
147149

148150
<Button
149151
variant="primary"
150152
onClick={handleSendMessage}
151153
disabled={(!inputMessage.trim() && !selectedImage) || isLoading}
152154
className="send-button"
155+
data-id="chat-send-btn"
153156
>
154157
<FormattedMessage id="quickDapp.send" defaultMessage="Send" />
155158
</Button>

‎libs/remix-ui/quick-dapp-v2/src/lib/components/CreateInstance/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ const CreateInstance: React.FC<CreateInstanceProps> = ({ isAiLoading }) => {
99

1010
if (isAiLoading) {
1111
return (
12-
<div className="d-flex flex-column align-items-center justify-content-center py-5">
12+
<div className="d-flex flex-column align-items-center justify-content-center py-5" data-id="ai-loading-spinner">
1313
<div className="spinner-border text-primary mb-3" role="status" style={{ width: '3rem', height: '3rem' }}></div>
1414
<h5 className="text-primary">Creating Your DApp...</h5>
1515
<p className="text-muted">RemixAI Assistant is generating your DApp code.</p>
@@ -26,7 +26,7 @@ const CreateInstance: React.FC<CreateInstanceProps> = ({ isAiLoading }) => {
2626
</p>
2727
</div>
2828

29-
<Card className="border-info">
29+
<Card className="border-info" data-id="quickdapp-getting-started">
3030
<Card.Header className="bg-info bg-opacity-10 border-info">
3131
<h5 className="mb-0 text-info">
3232
<i className="fas fa-rocket me-2"></i>

‎libs/remix-ui/quick-dapp-v2/src/lib/components/DappCard.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ const DappCard: React.FC<DappCardProps> = ({ dapp, isProcessing, onClick, onDele
3535
<div className="col-12 col-md-6 col-xl-4 mb-4 qd-card-col">
3636
<div
3737
className="card h-100 border-secondary shadow-sm"
38+
data-id={`dapp-card-${dapp.slug}`}
3839
style={{
3940
cursor: isProcessing ? 'wait' : 'pointer',
4041
transition: 'transform 0.2s',
@@ -65,13 +66,14 @@ const DappCard: React.FC<DappCardProps> = ({ dapp, isProcessing, onClick, onDele
6566
<img src={dapp.config.logo} alt="logo" style={{ width: '50px', height: '50px', borderRadius: '50%' }} />
6667
)}
6768

68-
<div className="position-absolute top-0 start-0 m-2 badge bg-primary opacity-75">
69+
<div className="position-absolute top-0 start-0 m-2 badge bg-primary opacity-75" data-id={`dapp-network-${dapp.slug}`}>
6970
{dapp.contract.networkName || 'Remix VM'}
7071
</div>
7172

7273
{!isProcessing && (
7374
<div
7475
className="position-absolute top-0 end-0 m-2"
76+
data-id={`delete-dapp-btn-${dapp.slug}`}
7577
onClick={(e) => {
7678
e.stopPropagation();
7779
onDelete();
@@ -97,7 +99,7 @@ const DappCard: React.FC<DappCardProps> = ({ dapp, isProcessing, onClick, onDele
9799

98100
<div className="card-body d-flex flex-column justify-content-between">
99101
<div>
100-
<h6 className="card-title fw-bold mb-1 text-truncate text-body">{dapp.name}</h6>
102+
<h6 className="card-title fw-bold mb-1 text-truncate text-body" data-id={`dapp-card-name-${dapp.slug}`}>{dapp.name}</h6>
101103
<small className="text-muted d-block text-truncate" style={{ fontSize: '0.8rem' }}>
102104
{dapp.id}
103105
</small>
@@ -113,7 +115,7 @@ const DappCard: React.FC<DappCardProps> = ({ dapp, isProcessing, onClick, onDele
113115
<small className="text-muted" style={{ fontSize: '0.75rem' }}>
114116
{dapp.deployment?.ensDomain || 'Not linked to ENS'}
115117
</small>
116-
<div className={`d-flex align-items-center ${statusColor}`}>
118+
<div className={`d-flex align-items-center ${statusColor}`} data-id={`dapp-status-${dapp.slug}`}>
117119
<i className={`fas ${statusIcon} me-1 small`}></i>
118120
<small className="fw-bold text-uppercase" style={{ fontSize: '0.75rem' }}>
119121
{dapp.status}

‎libs/remix-ui/quick-dapp-v2/src/lib/components/Dashboard.tsx‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -73,18 +73,18 @@ const Dashboard: React.FC<DashboardProps> = ({
7373
};
7474

7575
return (
76-
<div className="container-fluid p-4" style={{ minHeight: '100vh' }}>
76+
<div className="container-fluid p-4" data-id="quick-dapp-dashboard" style={{ minHeight: '100vh' }}>
7777
<div className="d-flex flex-column flex-md-row justify-content-between align-items-md-center mb-4 qd-header">
7878
<div>
7979
<h3 className="fw-bold mb-1 text-body">Quick Dapp</h3>
8080
<p className="text-secondary mb-0">Edit and deploy your dapps.</p>
8181
</div>
8282
<div className="d-flex gap-2 mt-3 mt-md-0 qd-header-buttons">
83-
<Button variant="primary" onClick={onCreateNew}>
83+
<Button variant="primary" onClick={onCreateNew} data-id="create-new-dapp-btn">
8484
<i className="fas fa-plus me-2"></i> Create a new dapp
8585
</Button>
8686
{dapps.length > 0 && (
87-
<Button variant="outline-danger" onClick={() => setShowDeleteAllModal(true)}>
87+
<Button variant="outline-danger" onClick={() => setShowDeleteAllModal(true)} data-id="delete-all-dapps-btn">
8888
<i className="fas fa-trash me-2"></i> Delete all dapps
8989
</Button>
9090
)}
@@ -93,7 +93,7 @@ const Dashboard: React.FC<DashboardProps> = ({
9393

9494
<div className="rounded p-3 mb-4 d-flex flex-wrap justify-content-between align-items-center gap-2 border qd-filter-bar">
9595
<h5 className="mb-0 text-body" style={{ whiteSpace: 'nowrap' }}>
96-
Your dapps <span className="badge bg-secondary ms-2">{filteredAndSortedDapps.length}</span>
96+
Your dapps <span className="badge bg-secondary ms-2" data-id="dapp-count-badge">{filteredAndSortedDapps.length}</span>
9797
{filteredAndSortedDapps.length !== validDapps.length && (
9898
<small className="text-muted ms-2" style={{ fontSize: '0.8rem' }}>
9999
(filtered from {validDapps.length})
@@ -108,6 +108,7 @@ const Dashboard: React.FC<DashboardProps> = ({
108108
style={{ width: 'auto', minWidth: '120px' }}
109109
value={selectedNetwork}
110110
onChange={(e) => setSelectedNetwork(e.target.value)}
111+
data-id="network-filter-select"
111112
>
112113
<option value="All Chains">All Chains</option>
113114
{availableNetworks.map(network => (
@@ -121,6 +122,7 @@ const Dashboard: React.FC<DashboardProps> = ({
121122
style={{ width: 'auto', minWidth: '120px' }}
122123
value={sortOrder}
123124
onChange={(e) => setSortOrder(e.target.value)}
125+
data-id="sort-order-select"
124126
>
125127
<option value="newest">Newest first</option>
126128
<option value="oldest">Oldest first</option>
@@ -169,7 +171,7 @@ const Dashboard: React.FC<DashboardProps> = ({
169171
<Button variant="secondary" onClick={() => setDappToDelete(null)}>
170172
Cancel
171173
</Button>
172-
<Button variant="danger" onClick={confirmDeleteOne}>
174+
<Button variant="danger" onClick={confirmDeleteOne} data-id="confirm-delete-one-btn">
173175
Yes, Delete
174176
</Button>
175177
</Modal.Footer>
@@ -190,7 +192,7 @@ const Dashboard: React.FC<DashboardProps> = ({
190192
<Button variant="secondary" onClick={() => setShowDeleteAllModal(false)}>
191193
Cancel
192194
</Button>
193-
<Button variant="danger" onClick={() => {
195+
<Button variant="danger" data-id="confirm-delete-all-btn" onClick={() => {
194196
if (onDeleteAll) onDeleteAll();
195197
setShowDeleteAllModal(false);
196198
}}>

‎libs/remix-ui/quick-dapp-v2/src/lib/components/DeployPanel/BaseAppWizard.tsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -435,7 +435,7 @@ const BaseAppWizard: React.FC = () => {
435435
const ipfsUrl = latestCid ? `https://ipfs.io/ipfs/${latestCid}` : '';
436436

437437
return (
438-
<div className="base-wizard-container">
438+
<div className="base-wizard-container" data-id="base-app-wizard">
439439
<Modal show={showSuccessModal} onHide={() => setShowSuccessModal(false)} centered>
440440
<Modal.Header closeButton className="bg-success text-white">
441441
<Modal.Title>{successModalContent.title}</Modal.Title>
@@ -486,7 +486,7 @@ const BaseAppWizard: React.FC = () => {
486486
</Modal>
487487

488488
{viewStep >= 5 ? (
489-
<Card className="border-success mb-3 shadow-sm">
489+
<Card className="border-success mb-3 shadow-sm" data-id="live-app-dashboard">
490490
<Card.Header className="bg-success text-white fw-bold d-flex justify-content-between align-items-center">
491491
<span><i className="fas fa-check-circle me-2"></i>Live App Dashboard</span>
492492
<span className="badge bg-white text-success">Active</span>
@@ -543,7 +543,7 @@ const BaseAppWizard: React.FC = () => {
543543
</Card.Body>
544544
</Card>
545545
) : (
546-
<Card className="mb-3 border-primary">
546+
<Card className="mb-3 border-primary" data-id="base-wizard-card">
547547
<Card.Header className="bg-primary text-white fw-bold d-flex justify-content-between align-items-center">
548548
<span><i className="fas fa-rocket me-2"></i>Setup Wizard</span>
549549
<div className="d-flex gap-2 align-items-center">
@@ -590,7 +590,7 @@ const BaseAppWizard: React.FC = () => {
590590

591591
<div className="wizard-content">
592592
{viewStep === 1 && (
593-
<div className="fade-in">
593+
<div className="fade-in" data-id="wizard-step-1-config">
594594
<h6 className="fw-bold mb-2">Step 1: App Registration</h6>
595595
<Card className="mb-3 bg-light border-0"><Card.Body>{renderEditForm()}</Card.Body></Card>
596596
<Alert variant="info" className="small p-2 mb-3">
@@ -608,14 +608,14 @@ const BaseAppWizard: React.FC = () => {
608608
/>
609609
</Form.Group>
610610

611-
<Button className="w-100" onClick={handleStep1Config} disabled={baseFlowLoading}>
611+
<Button className="w-100" onClick={handleStep1Config} disabled={baseFlowLoading} data-id="wizard-step1-next-btn">
612612
{baseFlowLoading ? 'Saving...' : 'Save & Next'}
613613
</Button>
614614
</div>
615615
)}
616616

617617
{viewStep === 2 && (
618-
<div className="fade-in">
618+
<div className="fade-in" data-id="wizard-step-2-deploy">
619619
<h6 className="fw-bold mb-2">Step 2: Deployment & ENS</h6>
620620
<Alert variant="info" className="small p-2 mb-3">
621621
Deploy your app to IPFS and register an ENS subdomain (`.remixdapp.eth`).
@@ -660,7 +660,7 @@ const BaseAppWizard: React.FC = () => {
660660
)}
661661

662662
{viewStep === 3 && (
663-
<div className="fade-in">
663+
<div className="fade-in" data-id="wizard-step-3-verify">
664664
<h6 className="fw-bold mb-2">Step 3: Verification & Association</h6>
665665
<Alert variant="info" className="border small p-2 mb-3">
666666
<ol className="mb-0 ps-3">
@@ -723,7 +723,7 @@ const BaseAppWizard: React.FC = () => {
723723
)}
724724

725725
{viewStep === 4 && (
726-
<div className="fade-in">
726+
<div className="fade-in" data-id="wizard-step-4-finalize">
727727
<h6 className="fw-bold mb-2">Step 4: Finalize</h6>
728728
<Alert variant="success" className="small p-2 mb-3 bg-success bg-opacity-10 border-success">
729729
Re-deploy your app with the association JSON to complete the verification.

‎libs/remix-ui/quick-dapp-v2/src/lib/components/DeployPanel/index.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@ function DeployPanel(): JSX.Element {
230230
const currentEnsDomain = ensResult.domain || activeDapp?.deployment?.ensDomain;
231231

232232
return (
233-
<div>
233+
<div data-id="deploy-panel">
234234
<Card className="mb-2">
235235
<Card.Header onClick={() => setIsDetailsOpen(!isDetailsOpen)} style={{ cursor: 'pointer' }} className="d-flex justify-content-between bg-transparent border-0">
236236
Dapp details <i className={`fas ${isDetailsOpen ? 'fa-chevron-up' : 'fa-chevron-down'}`}></i>
@@ -248,11 +248,11 @@ function DeployPanel(): JSX.Element {
248248
</Card.Header>
249249
<Collapse in={isPublishOpen}>
250250
<Card.Body>
251-
<Button variant="primary" className="w-100" onClick={() => handleIpfsDeploy()} disabled={isDeploying}>
251+
<Button variant="primary" className="w-100" onClick={() => handleIpfsDeploy()} disabled={isDeploying} data-id="deploy-ipfs-btn">
252252
{isDeploying ? <><i className="fas fa-spinner fa-spin me-1"></i> Uploading...</> : <FormattedMessage id="quickDapp.deployToIPFS" defaultMessage="Deploy to IPFS" />}
253253
</Button>
254254
{displayCid && (
255-
<Alert variant="success" className="mt-3" style={{ wordBreak: 'break-all' }}>
255+
<Alert variant="success" className="mt-3" style={{ wordBreak: 'break-all' }} data-id="deploy-ipfs-success">
256256
<div className="fw-bold">Deployed Successfully!</div>
257257
<div><strong>CID:</strong> {displayCid}</div>
258258
{displayGateway && <div className="mt-1"><a href={displayGateway} target="_blank" rel="noopener noreferrer">View DApp</a></div>}
@@ -265,7 +265,7 @@ function DeployPanel(): JSX.Element {
265265

266266
{displayCid && (
267267
<Card className="mb-2">
268-
<Card.Header onClick={() => setIsEnsOpen(!isEnsOpen)} style={{ cursor: 'pointer' }} className="d-flex justify-content-between bg-transparent border-0">
268+
<Card.Header onClick={() => setIsEnsOpen(!isEnsOpen)} style={{ cursor: 'pointer' }} className="d-flex justify-content-between bg-transparent border-0" data-id="ens-section-header">
269269
Register ENS (Arbitrum) <i className={`fas ${isEnsOpen ? 'fa-chevron-up' : 'fa-chevron-down'}`}></i>
270270
</Card.Header>
271271
<Collapse in={isEnsOpen}>

0 commit comments

Comments
 (0)