e2e

apps/remix-ide-e2e/src/commands/addFile.ts

@@ -55,7 +55,7 @@ function addFile(browser: NightwatchBrowser, name: string, content: NightwatchCo
             timeout: 60000
           })
           .waitForElementVisible({
-            selector: `//*[@data-id='activeTabTitle' and contains(., "${name}")]`,
+            selector: `//*[@data-id='tab-active' and @data-path="${name}"]`,
             locateStrategy: 'xpath'
           })
           .setEditorValue(content.content)

apps/remix-ide-e2e/src/commands/currentSelectedFileIs.ts

@@ -4,7 +4,7 @@ import EventEmitter from 'events'
 class CurrentSelectedFileIs extends EventEmitter {
   command (this: NightwatchBrowser, value: string): NightwatchBrowser {
     this.api
-      .waitForElementContainsText('*[data-id="tabs-component"] *[data-id="activeTabTitle"]', value)
+      .waitForElementContainsText('*[data-id="tabs-component"] *[data-id="tab-active"]', value)
       .perform(() => {
         this.emit('complete')
       })

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

@@ -58,7 +58,7 @@ module.exports = {
       .click('[data-id="homeTab-modal-footer-ok-react"]')
       .openFile('github/OpenZeppelin/openzeppelin-solidity/contracts/access/Roles.sol')
       .waitForElementVisible({
-        selector: `//*[@data-id='activeTabTitle' and contains(., "default_workspace/github/OpenZeppelin/openzeppelin-solidity/contracts/access/Roles.sol")]`,
+        selector: `//*[@data-id='tab-active' and @data-path="default_workspace/github/OpenZeppelin/openzeppelin-solidity/contracts/access/Roles.sol"]`,
         locateStrategy: 'xpath'
       })
       .getEditorValue((content) => {

libs/remix-ui/tabs/src/lib/remix-ui-tabs.tsx

@@ -99,9 +99,10 @@ export const TabsUI = (props: TabsUIProps) => {
           ref={el => { tabsRef.current[index] = el }}
           className={classNameTab}
           data-id={index === currentIndexRef.current ? 'tab-active' : ''}
+          data-path={tab.title}
         >
           {tab.icon ? (<img className="my-1 mr-1 iconImage" style={{ filter: invert }} src={tab.icon} />) : (<i className={classNameImg}></i>)}
-          <span data-id="activeTabTitle" className={`title-tabs ${getFileDecorationClasses(tab)}`}>{tab.title}</span>
+          <span  className={`title-tabs ${getFileDecorationClasses(tab)}`}>{tab.title}</span>
           {getFileDecorationIcons(tab)}
           <span className="close-tabs" onClick={(event) => { props.onClose(index); event.stopPropagation() }}>
             <i className="text-dark fas fa-times"></i>