Add css classes to CMS site

Experience Manager (PaaS/OnPrem)
1

Hi,

In our project we need to create automated testing in the CMS site using Selenium, however, to identify the HTML elements into the CMS site is difficult, there is not an unique identifier for some. Is there any way to add a custom attribute or a custom class name to an element? in that way I can use that to identify the element.

Regards.

2

Hi,

yes this can be a problem. You can of course add classes in your template, even fed by your components. It will have to be custom work on your part however. One way would be to add unique ids/classes in your templates directly. You can put a string on the request and use that as a prefix for ids/classes in your template.

3

We already created automated testing over SITE side, we want to create automated testing over CMS site, I mean, a script to do the following:

  1. Go to /cms
  2. Choose “Content” option.
  3. Choose “Documents” option.
  4. Open the submenu over any folder and choose “Add new Document”
  5. Set the document name and choose the type as a Banner.
  6. So on.

We found problems trying to access HTML elements like those, because there are not unique ids or classes to refer from Selenium.

For instance, the folders do not have id and only have this: class=“hi hi-folder hi-l”. It is not possible to tell apart folders.

Any idea on how to accomplish that?

Regards.

4

In the demo site at https://cms.demo.onehippo.com/, I was able to make a click event on the “About” folder in developer console, using the following:

$(‘.hippo-browser-documents-small-folders .hippo-tree-node-link:contains(“About”)’).click()

Could it help in your case?

Regards,

Woonsan

5

Hi,

please see:

6

You can use Wicket paths. See https://www.onehippo.org/library/development/create-a-selenium-test-case.html.

hth,

Mathijs