github tests

apps/remix-ide-e2e/src/tests/dgit_github.test.ts

@@ -0,0 +1,82 @@
+import { ChildProcess, spawn } from "child_process"
+import init from "../helpers/init"
+import { Nightwatch, NightwatchBrowser } from "nightwatch"
+
+
+module.exports = {
+    '@disabled': true,
+    before: function (browser, done) {
+        init(browser, done)
+    },
+    after: function (browser: NightwatchBrowser) {
+        browser.perform((done) => {
+            done()
+        })
+    },
+    'Update settings for git #group1': function (browser: NightwatchBrowser) {
+        browser.
+            clickLaunchIcon('dgit')
+            .waitForElementVisible('*[data-id="initgit-btn"]')
+            .click('*[data-id="initgit-btn"]')
+            .setValue('*[data-id="githubToken"]', process.env.dgit_token)
+            .setValue('*[data-id="gitubUsername"]', 'git')
+            .setValue('*[data-id="githubEmail"]', 'git@example.com')
+            .click('*[data-id="saveGitHubCredentials"]')
+    },
+    'check if the settings are loaded #group1': function (browser: NightwatchBrowser) {
+        browser.
+            click('*[data-id="github-panel"]')
+            .waitForElementVisible('*[data-id="connected-as-bunsenstraat"]')
+            .waitForElementVisible('*[data-id="connected-img-bunsenstraat"]')
+            .waitForElementVisible('*[data-id="connected-link-bunsenstraat"]')
+    },
+    'clone a repository #group1': function (browser: NightwatchBrowser) {
+        browser
+            .click('*[data-id="clone-panel"]')
+            .click({
+                selector: '//*[@data-id="clone-panel-content"]//*[@data-id="fetch-repositories"]',
+                locateStrategy: 'xpath'
+            })
+            .waitForElementVisible({
+                selector: '//*[@data-id="clone-panel-content"]//*[@id="repository-select"]',
+                locateStrategy: 'xpath'
+            })
+            .click({
+                selector: '//*[@data-id="clone-panel-content"]//*[@id="repository-select"]',
+                locateStrategy: 'xpath'
+            })
+            .waitForElementVisible({
+                selector: '//*[@data-id="clone-panel-content"]//*[contains(text(), "awesome-remix")]',
+                locateStrategy: 'xpath'
+            })
+            .click({
+                selector: '//*[@data-id="clone-panel-content"]//*[contains(text(), "awesome-remix")]',
+                locateStrategy: 'xpath'
+            })
+            .waitForElementVisible({
+                selector: '//*[@data-id="clone-panel-content"]//*[@id="branch-select"]',
+                locateStrategy: 'xpath'
+            })
+            .click({
+                selector: '//*[@data-id="clone-panel-content"]//*[@id="branch-select"]',
+                locateStrategy: 'xpath'
+            })
+            .click({
+                selector: '//*[@data-id="clone-panel-content"]//*[contains(text(), "master")]',
+                locateStrategy: 'xpath'
+            })
+            .waitForElementVisible({
+                selector: '//*[@data-id="clone-panel-content"]//*[@data-id="clonebtn-ethereum/awesome-remix-master"]',
+                locateStrategy: 'xpath'
+            })
+            .click({
+                selector: '//*[@data-id="clone-panel-content"]//*[@data-id="clonebtn-ethereum/awesome-remix-master"]',
+                locateStrategy: 'xpath'
+            })
+    },
+    'check if there is a README.md file #group1': function (browser: NightwatchBrowser) {
+        browser
+            .clickLaunchIcon('filePanel')
+            .waitForElementVisible('*[data-id="treeViewLitreeViewItemREADME.md"]')
+    }
+}

libs/remix-ui/git/src/components/github/branchselect.tsx

@@ -38,6 +38,7 @@ export const BranchSelect = (props: BranchySelectProps) => {
     <Select
       options={branchOptions}
       className="mt-1"
+      id="branch-select"
       onChange={(e: any) =>selectRemoteBranch(e)}
       theme={selectTheme}
       styles={selectStyles}

libs/remix-ui/git/src/components/github/devicecode.tsx

@@ -113,10 +113,10 @@ export const GetDeviceCode = () => {
           <div className="pt-2">
             <Card>
               <Card.Body>
-                <Card.Title>Connected as {context.gitHubUser.login}</Card.Title>
+                <Card.Title data-id={`connected-as-${context.gitHubUser.login}`}>Connected as {context.gitHubUser.login}</Card.Title>
                 <Card.Text>
-                  <img src={context.gitHubUser.avatar_url} className="w-100" />
+                  <img data-id={`connected-img-${context.gitHubUser.login}`} src={context.gitHubUser.avatar_url} className="w-100" />
-                  <a target="_blank" href={context.gitHubUser.html_url}>{context.gitHubUser.html_url}</a>
+                  <a data-id={`connected-link-${context.gitHubUser.login}`} href={context.gitHubUser.html_url}>{context.gitHubUser.html_url}</a>
                   {context.userEmails && context.userEmails.filter((email: any) => email.primary).map((email: any) => {
                     return <span key={email.email}><br></br>{email.email}</span>
                   })}

libs/remix-ui/git/src/components/github/repositoryselect.tsx

@@ -64,7 +64,7 @@ const RepositorySelect = (props: RepositorySelectProps) => {
   };
 
   return (
-    <><Button onClick={fetchRepositories} className="w-100 mt-1">
+    <><Button data-id='fetch-repositories' onClick={fetchRepositories} className="w-100 mt-1">
       <i className="fab fa-github mr-1"></i>Fetch Repositories from GitHub
     </Button>
     {
@@ -72,6 +72,7 @@ const RepositorySelect = (props: RepositorySelectProps) => {
         <Select
           options={repoOtions}
           className="mt-1"
+          id="repository-select"
           onChange={(e: any) => selectRepo(e)}
           theme={selectTheme}
           styles={selectStyles}

libs/remix-ui/git/src/components/github/selectandclonerepositories.tsx

@@ -49,7 +49,7 @@ export const SelectAndCloneRepositories = (props: RepositoriesProps) => {
       {repo &&<BranchSelect select={selectRemoteBranch} />}
 
       {repo && branch && branch.name && branch.name !== '0' ?
-        <button data-id='clonebtn' className='btn btn-primary mt-1 w-100' onClick={async () => {
+        <button data-id={`clonebtn-${repo.full_name}-${branch.name}`} className='btn btn-primary mt-1 w-100' onClick={async () => {
           await clone()
         }}>clone {repo.full_name}:{branch.name}</button> : null}
 

libs/remix-ui/git/src/components/navigation/github.tsx

@@ -17,7 +17,7 @@ export const GitHubNavigation = ({ eventKey, activePanel, callback }) => {
   return (
     <>
       <div className={'d-flex justify-content-between pt-1 pb-1 ' + (activePanel === eventKey? 'bg-light': '')}>
-        <span onClick={()=>handleClick()} role={'button'} className='nav d-flex justify-content-start align-items-center w-75'>
+        <span data-id='github-panel' onClick={()=>handleClick()} role={'button'} className='nav d-flex justify-content-start align-items-center w-75'>
           {
             activePanel === eventKey ? <FontAwesomeIcon className='' icon={faCaretDown}></FontAwesomeIcon> : <FontAwesomeIcon className='' icon={faCaretRight}></FontAwesomeIcon>
           }

libs/remix-ui/git/src/components/panels/clone.tsx

@@ -64,37 +64,39 @@ export const Clone = () => {
 
   return (
     <>
-      <InputGroup className="mb-1">
+      <div data-id="clone-panel-content">
-        <FormControl data-id="clone-url" id="cloneulr" placeholder="url" name='cloneurl' value={cloneUrl} onChange={e => onGitHubCloneUrlChange(e.target.value)} aria-describedby="urlprepend" />
+        <InputGroup className="mb-1">
-      </InputGroup>
+          <FormControl data-id="clone-url" id="cloneulr" placeholder="url" name='cloneurl' value={cloneUrl} onChange={e => onGitHubCloneUrlChange(e.target.value)} aria-describedby="urlprepend" />
+        </InputGroup>
 
-      <input name='clonebranch' onChange={e => onCloneBranchChange(e.target.value)} value={cloneBranch} className="form-control mb-1 mt-2" placeholder="branch" type="text" id="clonebranch" />
+        <input name='clonebranch' onChange={e => onCloneBranchChange(e.target.value)} value={cloneBranch} className="form-control mb-1 mt-2" placeholder="branch" type="text" id="clonebranch" />
-      <GitUIButton disabledCondition={!cloneUrl} data-id='clone-btn' className='btn btn-primary mt-1 w-100' onClick={async () => {
+        <GitUIButton disabledCondition={!cloneUrl} data-id='clone-btn' className='btn btn-primary mt-1 w-100' onClick={async () => {
-        clone()
+          clone()
-      }}>clone</GitUIButton>
+        }}>clone</GitUIButton>
-      <hr />
+        <hr />
-      <SelectAndCloneRepositories cloneAllBranches={cloneAllBranches} cloneDepth={cloneDepth} />
+        <SelectAndCloneRepositories cloneAllBranches={cloneAllBranches} cloneDepth={cloneDepth} />
-      <hr />
+        <hr />
-      <label>options</label>
+        <label>options</label>
-      <InputGroup className="mt-1 mb-1">
+        <InputGroup className="mt-1 mb-1">
-        <InputGroup.Prepend>
+          <InputGroup.Prepend>
-          <InputGroup.Text id="clonedepthprepend">
+            <InputGroup.Text id="clonedepthprepend">
-                        --depth
+              --depth
-          </InputGroup.Text>
+            </InputGroup.Text>
-        </InputGroup.Prepend>
+          </InputGroup.Prepend>
-        <FormControl id="clonedepth" type="number" value={cloneDepth} onChange={e => onDepthChange(parseInt(e.target.value))} aria-describedby="clonedepthprepend" />
+          <FormControl id="clonedepth" type="number" value={cloneDepth} onChange={e => onDepthChange(parseInt(e.target.value))} aria-describedby="clonedepthprepend" />
-      </InputGroup>
+        </InputGroup>
 
-      <RemixUiCheckbox
+        <RemixUiCheckbox
-        id={`cloneAllBranches`}
+          id={`cloneAllBranches`}
-        inputType="checkbox"
+          inputType="checkbox"
-        name="cloneAllBranches"
+          name="cloneAllBranches"
-        label={`Clone all branches`}
+          label={`Clone all branches`}
-        onClick={() => onAllBranchChange()}
+          onClick={() => onAllBranchChange()}
-        checked={cloneAllBranches}
+          checked={cloneAllBranches}
-        onChange={() => { }}
+          onChange={() => { }}
-      />
+        />
 
-      <hr></hr>
+        <hr></hr>
+      </div>
     </>)
 }