Selenium Automation For SpreadJS Sheets

Selenium Automation For SpreadJS Sheets

Posted by: asha.nirmala on 14 September 2019, 10:51 pm EST

• 

  asha.nirmala

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 14 September 2019, 10:51 pm EST

  Dear team,

  I am trying to automate SpreadJS sheets using selenium. I have gone through some of the post and was trying to use javascript for this. Do we need to add any of the Jars/libraries to access the methods like GcSpread. Now i am getting error like GcSpread is not defined.
  
  Could you please help me on this.

  I have opened the browser using selenium webdriver command in java. Then tried the below line
  
  js.executeScript(“new GcSpread.Sheets.Cell(‘Shee1’,7,5).text(‘tt’);”);

  Thanks
  
  Asha

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 15 September 2019, 7:16 pm EST

  Hi Asha,

  You do not need any additional Jars/libraries to test SpreadJS with Selenium.
  
  The GcSpread namespace is from as older version of SpreadJs, For Spread V12, we need to use the GC.Spread.Sheets namespace. Please refer to the following code snippet:

   /* find spread instance and save on window object for easy access */
  js.ExecuteScript("window.testSpread = GC.Spread.Sheets.findControl(document.querySelector(\"[gcuielement=\'gcSpreaad\']\"))");
  /* get value of cell 0, 0 of active sheet */
  js.ExecuteScript("return window.testSpread.getActiveSheet().getValue(0,0);");
  

  Regards
  
  Sharad

• 

  asha.nirmala

  • Post Options:
  • Link
    Copy

  Posted 16 September 2019, 1:01 am EST

  Thank you for the reply.
  
  Please find the code which i tried on the demo application given in the site.

  “The same error GC is not defined”

  ChromeOptions chromeoptions = new ChromeOptions();
  
  //chromeoptions.setBinary(path)
  
  System.setProperty(“webdriver.chrome.driver”, “chromedriver.exe”);
  
  driver = new ChromeDriver(chromeoptions);
  
  DesiredCapabilities capabilities = DesiredCapabilities.chrome();
  
  driver = new ChromeDriver(capabilities);
  
  driver.get(“https://www.grapecity.com/demos/spread/JS/TutorialSample/Showcase/financialKPIs/purejs”);
  
  JavascriptExecutor js = (JavascriptExecutor)driver;
  
  js.executeScript(“window.testSpread = GC.Spread.Sheets.findControl(document.querySelector("[gcuielement='gcSpreaad']"))”);

  	js.executeScript("return window.testSpread.getActiveSheet().getValue(0,0);");
  

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 16 September 2019, 4:48 pm EST

  The error is arising because the demo site runs the sample in a sandbox environment so the GC object is not exposed to the parent window.
  
  You may test your code on the following sample:
  
  https://www.grapecity.com/demos/spread/JS/InspectorSample/

  Also, I made a typo in the previous reply, attribute value needs to be gcSpread instead of gcSpreaad.

  js.executeScript("window.testSpread = GC.Spread.Sheets.findControl(document.querySelector(\"[gcuielement=\'gcSpread\']\"))");
  

• 

  sanjana.patel

  • Post Options:
  • Link
    Copy

  Posted 31 May 2021, 10:16 pm EST

  Hi Sharad
  
  I am trying automate spreadJs using selenium with Java. Below is my code snippet.

  JavascriptExecutor js = (JavascriptExecutor)driver;
  		
  		WebElement hostDiv = driver.findElement(By.id("vp_vp"));
  		
  		// get spreadInstance and save it on window object for easy access
  		js.executeScript("window.testSpread = new GC.Spread.Sheets.findControl(arguments[0]);", hostDiv);
  		// get Cell value of cell 1,1
  		js.executeScript("return window.testSpread.getActiveSheet().getValue(1,1);");
  		String value = (String) js.executeScript("return window.testSpread.getActiveSheet().getValue(1,1);");
  		// test value
  		 Assert.assertEquals("1", value);
  

  This is from where I am taking canvas id:

  <canvas id="vp_vp" gcuielement="gcWorksheetCanvas" width="1836" height="1" style="width: 1530px; height: 1px; cursor: default;" xpath="1">You need a browser which full supports HTML5 Canvas to run SpreadJS</canvas>
  

  I am getting ‘GC not defined’ error. Could you please check & let me know whats wrong?

  Please note, in my application, spreadJs is not used inside sandbox or iFrame.

• 

  avinash.pathak

  

  • Post Options:
  • Link
    Copy

  Posted 1 June 2021, 7:15 pm EST

  Hi Sanjana,

  This error usually comes when the GC object is not globally available, Please make sure the script has access to the GC object.

  For doing this you need to attach the GC object to the window. Please refer to the following code snippet and let us know if you face any issues.

  //in the project 
  import * as GC from "@grapecity/spread-sheets"
  window.GC = GC
  
  

  Regards
  
  Avinash

• 

  pramodhkomatireddy

  • Post Options:
  • Link
    Copy

  Posted 23 June 2021, 7:11 pm EST

  Hi Avinash,

  I am also facing same issue ‘GC is not defined’. But the import which you have given is for js class right. How can we use this in java class?

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 25 June 2021, 6:53 am EST

  Hi Pramodh,

  You need to write the specified import statement in the web app(JS project) which is using SpreadJS, and not in the testing(JAVA) project.

  Regards
  
  Sharad

• 

  adogu

  • Post Options:
  • Link
    Copy

  Posted 27 April 2022, 2:23 pm EST

  Is there a way to load the required library with a load script function? Something like:

  async function loadScript(url) {
  
  let response = await fetch(url);
  
  let script = await response.text();
  
  eval(script);
  
  }

  let scriptUrl = ‘https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js’
  
  loadScript(scriptUrl);

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 27 April 2022, 9:26 pm EST

  Hi Adem,

  We were unable to understand what you are trying to achieve by the given code. Could you please elaborate your use case so that we can have a better understanding and could assist you accordingly.

  Regards
  
  Ankit

• 

  adogu

  • Post Options:
  • Link
    Copy

  Posted 28 April 2022, 8:59 am EST

  Hey Ankit,

  I’m also having the ‘GC is not defined’ issue and looking for workarounds because I will not be able to add the recommended solution to the main.js.

  Even on one of your sample pages I’m getting the same issue, it’d worked for me before;
  
  https://www.grapecity.com/spreadjs/demos/showcase/aging-report/purejs

  
  var hostDiv = document.getElementById('ss');
  window.testSpread = GC.Spread.Sheets.findControl(hostDiv);
  
  

  Uncaught ReferenceError: GC is not defined

  The same thing works on
  
  https://www.grapecity.com/spreadjs/demos/sample/showcase/aging-report/purejs/

  Edit:
  
  I was able to load GC object by

  
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://www.grapecity.com/spreadjs/demos/en/purejs/node_modules/@grapecity/spread-sheets/dist/gc.spread.sheets.all.min.js';
  document.head.appendChild(script);
  
  

  which resolved the ‘GC is not defined’ issue, however, now I’m facing a different issue where it says “window.testSpread.getActiveSheet is not a function”

  We are using version 11.2.14. Can you please help with this?

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 28 April 2022, 10:01 pm EST - Updated 3 October 2022, 12:12 am EST

  Hi Adem,

  Query: Even on one of your sample pages I’m getting the same issue, it’d worked for me before;
  
  https://www.grapecity.com/spreadjs/demos/showcase/aging-report/purejs

  —> You should change the context to purejs in javascript console, and you will be able to access the GC. In the another sample(https://www.grapecity.com/spreadjs/demos/sample/showcase/aging-report/purejs/), there is no iframe and you can directly access GC.

  Query: however, now I’m facing a different issue where it says “window.testSpread.getActiveSheet is not a function”

  —> We were unable to replicate the issue at our end. Please share a working sample with all the configurations done so that we can investigate it at our end and assist you accordingly.

  You could get the spread instance using the findControl method. In the findControl method, we need to pass the host element for the spread. HostElement is the element which is passed in the Workbook constructor when creating the workbook/spreadSheet. SpreadJS provides various methods like fromJSON(), getActiveSheet(), getColumnCount(), etc, that you can use to test various functionality.

  You can refer to the following code snippet.

  
  // get hostElement
  var hostDiv = webDriver.FindElement(By.Id("ss"));         // where ss is id of the spread element
  // get spreadInstance and save it on window object for easy access
  webDriver.ExecuteScript("window.testSpread = new GC.Spread.Sheets.findControl(arguments[0]);", hostDiv);
  // get Cell value of cell 0,0
  var value = webDriver.ExecuteScript("return window.testSpread.getActiveSheet().getValue(0,0);");
  // test value
   Assert.AreEqual("1", value);
  

  Please find the attached gif that demonstrate changing the context in console and using findControl method.

  Regards
  
  Ankit
  
  

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 28 April 2022, 10:11 pm EST

  Hi,

  The link you are using is for the latest version of SpreadJS V15.0.7. For Version 11.2, use this link: https://unpkg.com/@grapecity/spread-sheets@11.2.4/dist/gc.spread.sheets.all.min.js

  Regards

  Ankit

• 

  adogu

  • Post Options:
  • Link
    Copy

  Posted 1 May 2022, 8:35 am EST

  Hi Ankit,

  Thank you so much for your help! I have a better understanding now. We are working with a third party company for our development efforts so I’m trying to figure out if we must add the below code to our main.js

  //in the project 
  import * as GC from "@grapecity/spread-sheets"
  window.GC = GC
  
  

  or is there any other way to solve this?

  I was able to load GC to our site externally with running this below code in Chrome console

  
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://www.grapecity.com/spreadjs/demos/en/purejs/node_modules/@grapecity/spread-sheets/dist/gc.spread.sheets.all.min.js';
  document.head.appendChild(script);
  
  

  However, after making GC object available with running the code above in Chrome console, I’m getting “window.testSpread.getActiveSheet is not a function” error.

  At this point, I’m looking for a solution without any code deployments to our app, is there any way to do that?

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 1 May 2022, 4:32 pm EST - Updated 3 October 2022, 12:13 am EST

  Hi Adem,

  Query: or is there any other way to solve this?
  
  —> You can use both the approached to load the SpreadSheets module.

  Approach1

  //in the project 
  import * as GC from "@grapecity/spread-sheets"
  window.GC = GC
  

  or

  Approach2

  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://www.grapecity.com/spreadjs/demos/en/purejs/node_modules/@grapecity/spread-sheets/dist/gc.spread.sheets.all.min.js';
  document.head.appendChild(script);
  

  If you are using the first approach, you need to expose GC to the window(window.GC = GC). You should add the code(Approach1) to your main.js file. If you are using the second approach, you won’t be required to expose GC to window.

  Query: I’m getting “window.testSpread.getActiveSheet is not a function” error.
  
  —> You need to expose the testSpread object to the window.
  
  Steps you should follow after making the GC object available.

  1. Get the spread instance.

  let testSpread = GC.Spread.Sheets.findControl(“ss”);

  2. Expose the testSpread to the window.

  window["testSpread] = testSpread.

  3. Access the active sheet

  window.testSpread.getActiveSheet();

  You will be able to access the active sheet. If the issue still persists for you, please share a working sample and the steps you are performing.

  Regards
  
  Ankit

  

• 

  adogu

  • Post Options:
  • Link
    Copy

  Posted 27 June 2022, 12:42 pm EST - Updated 3 October 2022, 12:13 am EST

  Thanks for all the help, we were able to implement your suggestion and worked fine. Now we’re facing another issue where we try to select a value from a dropdown. Can you please help me with this?

  

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 27 June 2022, 11:24 pm EST

  Hi Adem,

  As per my understanding, you are using the List Data Validator as shown in the image.

  You can use the getCellRect method to get the size and location of the cell rectangle. Get the coordinates using the getCellRect method and click on the dropdown icon. This will open the dropdown list. You can get the select element using document.querySelector(‘select[gcuielement=“gcValidationSelect”]’), get the position of the select and perform the click/scroll on the items.

  If the issue still persists for you, please share a working sample along with the steps you are performing so that we can test at our end and could assist you accordingly.

  getCellRect method: https://www.grapecity.com/spreadjs/docs/latest/online/SpreadJS~GC.Spread.Sheets.Worksheet~getCellRect.html

  Regards
  
  Ankit