mirror
/
remix-project
mirror of https://github.com/ethereum/remix-project.git
2
0
Fork 0
Code Issues Releases Wiki Activity

Update Homepage tests to use data-attributes

Browse Source
pull/1/head
ioedeveloper 5 years ago
parent 3736bede11
commit cfbe3e2ff1
9 changed files with 49 additions and 48 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 6
      src/app.js
  2. 2
      src/app/components/main-panel.js
  3. 2
      src/app/components/side-panel.js
  4. 5
      src/app/components/vertical-icons.js
  5. 2
      src/app/panels/file-panel.js
  6. 10
      src/app/panels/terminal.js
  7. 1
      src/app/ui/TreeView.js
  8. 4
      src/app/ui/landing-page/landing-page.js
  9. 65
      test-browser/tests/homepage.js

6
src/app.js
Unescape View File

@ -141,21 +141,21 @@ class App {
if (self._view.el) return self._view.el if (self._view.el) return self._view.el
// not resizable // not resizable
self._view.iconpanel = yo` self._view.iconpanel = yo`
<div id="icon-panel" class="${css.iconpanel} bg-light"> <div id="icon-panel" data-id="icon-panel" class="${css.iconpanel} bg-light">
${''} ${''}
</div> </div>
` `
// center panel, resizable // center panel, resizable
self._view.sidepanel = yo` self._view.sidepanel = yo`
<div id="side-panel" style="min-width: 320px;" class=${css.sidepanel}> <div id="side-panel" data-id="side-panel" style="min-width: 320px;" class=${css.sidepanel}>
${''} ${''}
</div> </div>
` `
// handle the editor + terminal // handle the editor + terminal
self._view.mainpanel = yo` self._view.mainpanel = yo`
<div id="main-panel" class=${css.mainpanel}> <div id="main-panel" data-id="main-panel" class=${css.mainpanel}>
${''} ${''}
</div> </div>
` `

2
src/app/components/main-panel.js
Unescape View File

@ -26,7 +26,7 @@ export class MainPanel extends AbstractPanel {
render () { render () {
return yo` return yo`
<div class=${css.pluginsContainer}> <div class=${css.pluginsContainer} data-id="mainPanelPluginsContainer">
${this.view} ${this.view}
</div>` </div>`
} }

2
src/app/components/side-panel.js
Unescape View File

@ -132,7 +132,7 @@ export class SidePanel extends AbstractPanel {
return yo` return yo`
<header class="${css.swapitHeader} px-3"> <header class="${css.swapitHeader} px-3">
<h6 class="${css.swapitTitle}">${name}</h6> <h6 class="${css.swapitTitle}" data-id="swapitTitle">${name}</h6>
${docLink} ${docLink}
${versionWarning} ${versionWarning}
</header> </header>

5
src/app/components/vertical-icons.js
Unescape View File

@ -227,6 +227,7 @@ export class VerticalIcons extends Plugin {
this.appManager.ensureActivated('home') this.appManager.ensureActivated('home')
}}" }}"
plugin="home" title="Home" plugin="home" title="Home"
data-id="homeIcon"
> >
<svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 100"> <svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 100">
<title>remix_logo1</title> <title>remix_logo1</title>
@ -238,7 +239,7 @@ export class VerticalIcons extends Plugin {
</div>` </div>`
this.iconKind['fileexplorer'] = yo` this.iconKind['fileexplorer'] = yo`
<div id='fileExplorerIcons'> <div id='fileExplorerIcons' data-id="fileExplorerIcons">
</div> </div>
` `
@ -273,7 +274,7 @@ export class VerticalIcons extends Plugin {
` `
this.iconKind['settings'] = yo` this.iconKind['settings'] = yo`
<div id='settingsIcons'> <div id='settingsIcons' data-id="settingsIcons">
</div> </div>
` `

2
src/app/panels/file-panel.js
Unescape View File

@ -64,7 +64,7 @@ module.exports = class Filepanel extends ViewPlugin {
const explorers = yo` const explorers = yo`
<div> <div>
<div class=${css.treeview}>${fileExplorer.init()}</div> <div class=${css.treeview} data-id="fileExplorerInit">${fileExplorer.init()}</div>
<div class="filesystemexplorer ${css.treeview}">${fileSystemExplorer.init()}</div> <div class="filesystemexplorer ${css.treeview}">${fileSystemExplorer.init()}</div>
</div> </div>
` `

10
src/app/panels/terminal.js
Unescape View File

@ -123,14 +123,14 @@ class Terminal extends Plugin {
self._view.input.innerText = '\n' self._view.input.innerText = '\n'
self._view.cli = yo` self._view.cli = yo`
<div id="terminalCli" class="${css.cli}"> <div id="terminalCli" data-id="terminalCli" class="${css.cli}">
<span class=${css.prompt}>${'>'}</span> <span class=${css.prompt}>${'>'}</span>
${self._view.input} ${self._view.input}
</div> </div>
` `
self._view.icon = yo` self._view.icon = yo`
<i onmouseenter=${hover} onmouseleave=${hover} onmousedown=${minimize} <i onmouseenter=${hover} onmouseleave=${hover} onmousedown=${minimize}
class="btn btn-secondary btn-sm align-items-center ${css.toggleTerminal} fas fa-angle-double-down"></i>` class="btn btn-secondary btn-sm align-items-center ${css.toggleTerminal} fas fa-angle-double-down" data-id="toggleTerminal"></i>`
self._view.dragbar = yo` self._view.dragbar = yo`
<div onmousedown=${mousedown} class=${css.dragbarHorizontal}></div>` <div onmousedown=${mousedown} class=${css.dragbarHorizontal}></div>`
@ -146,7 +146,7 @@ class Terminal extends Plugin {
self._view.bar = yo` self._view.bar = yo`
<div class="${css.bar}"> <div class="${css.bar}">
${self._view.dragbar} ${self._view.dragbar}
<div class="${css.menu} border-top border-dark bg-light"> <div class="${css.menu} border-top border-dark bg-light" data-id="toggleTerminalMenu">
${self._view.icon} ${self._view.icon}
<div class=${css.clear} id="clearConsole" onclick=${clear}> <div class=${css.clear} id="clearConsole" onclick=${clear}>
<i class="fas fa-ban" aria-hidden="true" title="Clear console" <i class="fas fa-ban" aria-hidden="true" title="Clear console"
@ -177,9 +177,9 @@ class Terminal extends Plugin {
</div> </div>
` `
self._view.term = yo` self._view.term = yo`
<div class="${css.terminal_container}" onscroll=${throttle(reattach, 10)} onclick=${focusinput}> <div class="${css.terminal_container}" data-id="terminal_container" onscroll=${throttle(reattach, 10)} onclick=${focusinput}>
${self._components.autoCompletePopup.render()} ${self._components.autoCompletePopup.render()}
<div class="bg-secondary" style=" <div class="bg-secondary" data-id="terminalContainerDisplay" style="
position: absolute; position: absolute;
height: 100%; height: 100%;
width: 100%; width: 100%;

1
src/app/ui/TreeView.js
Unescape View File

@ -91,6 +91,7 @@ class TreeView {
var list = yo`<ul key=${keyPath} class=${css.ul_tv}>${children}</ul>` var list = yo`<ul key=${keyPath} class=${css.ul_tv}>${children}</ul>`
list.style.display = 'none' list.style.display = 'none'
caret.className = list.style.display === 'none' ? `fas fa-caret-right caret ${css.caret_tv}` : `fas fa-caret-down caret ${css.caret_tv}` caret.className = list.style.display === 'none' ? `fas fa-caret-right caret ${css.caret_tv}` : `fas fa-caret-down caret ${css.caret_tv}`
caret.setAttribute('data-id', `toggle_${keyPath}`)
label.onclick = function () { label.onclick = function () {
self.expand(keyPath) self.expand(keyPath)
} }

4
src/app/ui/landing-page/landing-page.js
Unescape View File

@ -177,7 +177,7 @@ export class LandingPage extends ViewPlugin {
document.location.reload() document.location.reload()
} }
const img = yo`<img src="assets/img/hexagon-remix-greengrey-texture.png"></img>` const img = yo`<img src="assets/img/hexagon-remix-greengrey-texture.png"></img>`
let container = yo`<div class="${css.homeContainer} bg-light"> let container = yo`<div class="${css.homeContainer} bg-light" data-id="homeContainer">
<div> <div>
<div class="alert alert-info clearfix ${css.thisJumboton}"> <div class="alert alert-info clearfix ${css.thisJumboton}">
<div class="${css.headlineContainer}"> <div class="${css.headlineContainer}">
@ -189,7 +189,7 @@ export class LandingPage extends ViewPlugin {
</div> </div>
</div><!-- end of jumbotron --> </div><!-- end of jumbotron -->
</div><!-- end of jumbotron container --> </div><!-- end of jumbotron container -->
<div class="row ${css.hpSections}"> <div class="row ${css.hpSections}" data-id="hpSections">
<div id="col1" class="col-sm-7"> <div id="col1" class="col-sm-7">
<div class="mb-5"> <div class="mb-5">
<h4>Environments</h4> <h4>Environments</h4>

65
test-browser/tests/homepage.js
Unescape View File

@ -7,71 +7,70 @@ module.exports = {
init(browser, done, 'http://127.0.0.1:8080', false) init(browser, done, 'http://127.0.0.1:8080', false)
}, },
'Loads Icon\'s Panel': function (browser) { 'Loads Icon\'s Panel': function (browser) {
browser.waitForElementVisible('#icon-panel', 10000) browser.waitForElementVisible('div[data-id="icon-panel"]', 10000)
.waitForElementVisible('#icon-panel > div > div[class^="homeIcon"]') .waitForElementVisible('div[data-id="homeIcon"]')
.waitForElementVisible('#icon-panel #fileExplorerIcons > div:nth-child(1)') .waitForElementVisible('div[plugin="fileExplorers"]')
.waitForElementVisible('#icon-panel #settingsIcons > div:nth-child(1)') .waitForElementVisible('div[plugin="pluginManager"]')
.waitForElementVisible('#icon-panel #settingsIcons > div:nth-child(2)') .waitForElementVisible('div[plugin="settings"]')
}, },
'Loads Side Panel': function (browser) { 'Loads Side Panel': function (browser) {
browser.waitForElementVisible('#side-panel') browser.waitForElementVisible('div[data-id="side-panel"]')
.assert.containsText('#side-panel h6[class^="swapitTitle"]', 'FILE EXPLORERS') .assert.containsText('h6[data-id="swapitTitle"]', 'FILE EXPLORERS')
.waitForElementVisible('#side-panel div[class^="treeview"]') .waitForElementVisible('div[data-id="fileExplorerInit"]')
.waitForElementVisible('#side-panel ul[key="browser"] > li:nth-child(4)') .waitForElementVisible('li[key="browser/4_Ballot_test.sol"]')
}, },
'Loads Main View': function (browser) { 'Loads Main View': function (browser) {
browser.waitForElementVisible('#main-panel > div[class^="mainview"] > div[class^="pluginsContainer"]') browser.waitForElementVisible('div[data-id="mainPanelPluginsContainer"]')
.waitForElementVisible('#main-panel div[class^="homeContainer"] > div:nth-child(2)') .waitForElementVisible('div[data-id="homeContainer"]')
.waitForElementVisible('#main-panel div[class^="row hpSections"] > div:nth-child(1)') .waitForElementVisible('div[data-id="hpSections"]')
.waitForElementVisible('#main-panel div[class^="panel"] > div[class^="terminal_container"]:nth-child(2)') .waitForElementVisible('div[data-id="terminalContainerDisplay"]')
}, },
'Loads terminal': function (browser) { 'Loads terminal': function (browser) {
browser browser
.waitForElementVisible('#terminalCli', 10000) .waitForElementVisible('div[data-id="terminalCli"]', 10000)
.journalLastChildIncludes('Welcome to Remix') .journalLastChildIncludes('Welcome to Remix')
}, },
'Toggles Side Panel': function (browser) { 'Toggles Side Panel': function (browser) {
browser.waitForElementVisible('#side-panel') browser.waitForElementVisible('div[data-id="side-panel"]')
.assert.visible('#side-panel') .assert.containsText('h6[data-id="swapitTitle"]', 'FILE EXPLORERS')
.assert.containsText('#side-panel h6[class^="swapitTitle"]', 'FILE EXPLORERS')
.clickLaunchIcon('fileExplorers') .clickLaunchIcon('fileExplorers')
.assert.hidden('#side-panel') .assert.hidden('div[data-id="side-panel"]')
.clickLaunchIcon('fileExplorers') .clickLaunchIcon('fileExplorers')
.assert.visible('#side-panel') .assert.visible('div[data-id="side-panel"]')
.assert.containsText('#side-panel h6[class^="swapitTitle"]', 'FILE EXPLORERS') .assert.containsText('h6[data-id="swapitTitle"]', 'FILE EXPLORERS')
}, },
'Toggles Terminal': function (browser) { 'Toggles Terminal': function (browser) {
browser.waitForElementVisible('#main-panel div[class^="panel"] > div[class^="terminal_container"]') browser.waitForElementVisible('div[data-id="terminal_container"]')
.assert.visible('#main-panel div[class^="panel"] > div[class^="terminal_container"]:nth-child(2)') .assert.visible('div[data-id="terminalContainerDisplay"]')
.click('div[class^="bar"] > div[class^="menu"] > i') .click('i[data-id="toggleTerminal"]')
.checkElementStyle('div[class^="bar"] > div[class^="menu"]', 'height', '35px') .checkElementStyle('div[data-id="toggleTerminalMenu"]', 'height', '35px')
.click('div[class^="bar"] > div[class^="menu"] > i') .click('i[data-id="toggleTerminal"]')
.assert.visible('#main-panel div[class^="panel"] > div[class^="terminal_container"]:nth-child(2)') .assert.visible('div[data-id="terminalContainerDisplay"]')
}, },
'Toggles File Explorer Browser': function (browser) { 'Toggles File Explorer Browser': function (browser) {
browser browser
.waitForElementVisible('#side-panel div[class^="treeview"]') .waitForElementVisible('div[data-id="fileExplorerInit"]')
.assert.visible('ul[key="browser"]') .assert.visible('ul[key="browser"]')
.click('li[key="browser"] > div[key="browser"] > div.fas') .click('div[data-id="toggle_browser"]')
.assert.hidden('ul[key="browser"]') .assert.hidden('ul[key="browser"]')
.click('li[key="browser"] > div[key="browser"] > div.fas') .click('div[data-id="toggle_browser"]')
.assert.visible('ul[key="browser"]') .assert.visible('ul[key="browser"]')
}, },
'Switch Tabs using tabs icon': function (browser) { 'Switch Tabs using tabs icon': function (browser) {
browser browser
.waitForElementVisible('#side-panel div[class^="treeview"]') .waitForElementVisible('div[data-id="fileExplorerInit"]')
.switchFile('browser/3_Ballot.sol') .switchFile('browser/3_Ballot.sol')
.assert.containsText('div[title="browser/3_Ballot.sol"] > span', '3_Ballot.sol') .assert.containsText('div[title="browser/3_Ballot.sol"]', '3_Ballot.sol')
.click('div.dropdown.px-1 > span.dropdownCaret') .click('span[class^=dropdownCaret]')
.click('#homeItem') .click('#homeItem')
.assert.containsText('div[title="home"] > span', 'Home') .assert.containsText('div[title="home"]', 'Home')
.end() .end()
}, },

Write Preview
Loading…
Cancel
Save