Cannot add new Given/When/Then, getting error `SyntaxError: Invalid regular expression: missing /`

Question

I had configured cucumber + protractor, and I firstly was splitting stepDefinitions into different files like this:

When I created new features files, and started running, cucumber/protractor did not recognized these new steps I was adding to the other files. So I decided to move all the new steps into the same file.

But when I run, although they are well written (checked and compared thousands of times) I getting this error:

    [launcher] Error: /Users/brunosoko/Documents/Dev/Personal/test2/features/step_definitions/homepage/homepage.js:30
    this.When(/^I select an image
     or video$/, function (done) {
              ^
SyntaxError: Invalid regular expression: missing /
    at exports.runInThisContext (vm.js:73:16)
    at Module._compile (module.js:443:25)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at /Users/brunosoko/Documents/Dev/Personal/test2/node_modules/cucumber/lib/cucumber/cli/support_code_loader.js:63:29
    at Array.forEach (native)
    at Object.wrapper (/Users/brunosoko/Documents/Dev/Personal/olapic-test2/node_modules/cucumber/lib/cucumber/cli/support_code_loader.js:62:15)

I've the following versions running of protractor and cucumber:

  "devDependencies": {
    "chai": "*",
    "chai-as-promised": "^5.1.0",
    "cucumber": "~0.6.0",
    "protractor": "1.4.0",
    "protractor-cucumber-junit": "latest",
    "protractor-html-screenshot-reporter": "^0.0.21",
    "selenium-webdriver": "2.47.0"   },

These are my stepDefinition:

```
    /*Given*/
    this.Given(/^I am at the homepage$/, function (done) {
        browser.get('').then(function(){
            CarouselPage.clickOutSidePopUp();
            done();
        });
    });
    this.Given(/^I can see that images and videos are present on the widget$/ 
    , function (done) {
        expect(CarouselPage.checkMediaSource()).to.eventually.be.true;
        done();
    });


    this.When(/^I select an image
     or video$/, function (done) {
        CarouselPage.getMedia(1).click();
        done();
    });


    /*Then*/
    this.Then(/^I see that Carousel Widget is correctly displayed$/, function(done){
        expect(CarouselPage.carouselContainer.isPresent()).to.eventually.be.true;
        done();
    });

    this.Then(/^I see the viewer modal
    
    
    $/, function(done){
        expect(ViewerModal.viewerContainer.isPresent()).to.eventually.be.true;
        done();
    });

    this.Then(/^I see the Gallery widget
    $/, function(done){
        expect(CarouselPage.carouselContainer.isPresent()).to.eventually.be.true;
        done();
    }); ```

So, what am I doing wrong? Do I need to clear some cache? is this a bug with the versions I am using?

Thanks!

NOTE: What also called my attention is that if I even comment the whole step, I see this on the console

./node_modules/protractor/bin/protractor conf.js
util.puts: Use console.log instead
Starting selenium standalone server...
util.puts: Use console.log instead
Selenium standalone server started at http://192.168.0.101:58696/wd/hub
[launcher] Error: /Users/brunosoko/Documents/Dev/Personal/test2/features/step_definitions/homepage/stepsDefinitions.js:24
    //this.When(/^I select an image
     or video$/, function (done) {
                                        ^^^^^^
SyntaxError: Unexpected identifier
    at exports.runInThisContext (vm.js:73:16)
    at Module._compile (module.js:443:25)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at /Users/brunosoko/Documents/Dev/Personal/test2/node_modules/cucumber/lib/cucumber/cli/support_code_loader.js:63:29
    at Array.forEach (native)
    at Object.wrapper (/Users/brunosoko/Documents/Dev/Personal/test2/node_modules/cucumber/lib/cucumber/cli/support_code_loader.js:62:15)

EDIT 2: Here's my conf.js file, in case you see I'm doing wrong something here as well

exports.config = {
    specs: [
        'features/*.feature'
    ],
    baseUrl: "http://www.page.com",
    multiCapabilities: [
        {
            'browserName': 'chrome'
        }
    ],
    framework: 'cucumber',
    //seleniumAddress: 'http://localhost:4444/wd/hub',
    cucumberOpts: {
        require: 'features/step_definitions/**/*.js',
        format: 'pretty'
    },
    resultJsonOutputFile: 'report.json',

    onPrepare: function () {

        browser.driver.manage().window().maximize();

        browser.ignoreSynchronization = true;

        browser.manage().timeouts().implicitlyWait(20000);

        browser.getCapabilities().then(function (cap) {
            browserName = cap.caps_.browserName;
        });

    }
};

Answer 1

That first character after image is a unicode line separator. Delete that and node will be able to parse the regular expression.