Skip to content
Snippets Groups Projects

OCE Scenario Maker

OCE Scenario Maker is an application that aims at creating and editing scenarios for the Opportunistic Composition Engine (see https://gitlab.irit.fr/oppocompo/oppocompo/OCE). More precisely, this tool can be used to create scenarios for the OCE Testing Tool to experiment easier.

Requirements

To run and use OCE Scenario Maker, you must have:

  • NodeJS v14.17.0 or higher
  • npm v7.14.0 or higher

Dependencies

You can see dependencies in the package.json file but here is an overview of them:

  • avj
  • bootstrap-vue
  • vue
  • vuex

Install and run

To install this tool, after cloning the project, you have to use the command npm install on the root folder. Then, you can run it in development mode using the command vue-cli-service serve.

Guide

With this tool, you can create and edit scenarios. When you run the application, on the web page, you can differentiate two parts. On the left side, you can create your own component library by adding components with services. On the right side, you can create scenario cycles, put components in it and link components to others. How does it work? After building your library, drag and drop components in cycles and choose the bindings. When you finish, press the "Save Scenario" button to save the scenario json file on your computer. A demonstration video of OCE Scenario Maker is available here.

Testing

To set up, write and run front-end tests, we use the Cypress tool. Cypress makes us able to create end-to-end tests and check how the front components of this application behave in any case we want to test.

To run available end-to-end tests, use the command vue-cli-service test:e2e, a window will open, and you can choose which specification you want to run by clicking on it, and you will see the execution of the tests.

In the OCE Scenario Maker project, we try to test the majority of the features. Currently, the tested features are:

  • Component creation and deletion
  • Library display
  • Cycle creation and deletion
  • Adding and removing components to cycles
  • Linking components
  • Adding and removing bindings

Cypress also makes you able to check the generated code coverage report by opening the coverage/lcov-report/index.html locally page. Currently, around 95% of the features are covered by end-to-end tests.

Warning: when you check a vue component code coverage, there may be an offset between the coverage information and the targeted line of code (offset = html template size)

Contributors

The following people have contributed to the source code of this project:

  • Kévin DELCOURT
  • Maxence DEMOUGEOT
  • Jordan LEVY