Skip to content

Latest commit

 

History

History
276 lines (205 loc) · 7.31 KB

Configuration.md

File metadata and controls

276 lines (205 loc) · 7.31 KB

Configuration

For a detailed example also take a look at the example.config.json in the project root.

All relative paths will be resolve in relation to the main config file. Required variables are marked with a ❗. Variables marked with a 💀 are deprecated and will be removed in the near future.

❗ patternlabUrl (default: http://localhost:3000)

The domain where the patternlab styleguide is located.

"patternlabUrl": "https://domainForPatternLab:1337"

❗ screenSizes

A collection of screen sizes with will be used for the screen shots. The key will be used for the filename of the screen shot. Beware that the screen shot might be smaller due to the captured html element. They can be referenced in defaultSizes and pattern specific settings screenSizes, additionalScreenSizes, excludeScreenSizes

"screenSizes": {
  "yourScreenSize": {
    "width": 999,
    "height": 666
  }
}

defaultSizes

An array containing keys of the screenSizes. For all of these sizes every pattern will be taken a screen shot of, if not defined otherwise in the pattern specific configuration. See screenSizes, additionalScreenSizes and excludeScreenSizes for details.

"defaultSizes": ["yourScreenSize-1", "yourScreenSize-2"]

loadOnSinglePage (default: false)

A boolean to determine if the screenshots should be taken on the rendered pages of the single patterns or if the screenshots should be taken on the styleguide page.

This can also be set only on specific patterns

"loadOnSinglePage": false

groupTestsByType (default: false)

A boolean to determine if the tests should be grouped by pattern type. By default this is off and so the tests are all under one parentSuite in gemini named "Patternlab"

"groupTestsByType": false

excludePatterns

An array containing regular expressions to exclude patterns for the tests.

"excludePatterns": [
  "^templates"
]

excludeImplicit (default: false)

A switch to change the behavior how to process patterns. By default if a pattern is found in the markup, which is not defined in the patterns section of the patternlab-to-gemini configuration, it will be screenshotted in all defined screensizes. If this is set to true only the patterns which are defined in the patternlab-to-gemini config are screenshotted.

"excludeImplicit": true

excludeStates

An array containing regular expressions to exclude patterns by an assigned state See http://patternlab.io/docs/pattern-states.html.

"excludeStates": [
  "inprogress",
  "ideas",
]

outputFile (default: ./patternlabTests.js)

The path to the file where the generated tests will be stored.

"patternConfigFile": "./patternlabTests.js"

💀 patternConfigFile

Pattern settings are part of the main config file. See patterns

The path to the file which contains settings for specific patterns.

"patternConfigFile": "./pattern.config.json"

patterns

An object containing pattern specific configuration. The key has to map a pattern id from the styleguide. The object can contain any number of pattern specific configuration.

"patterns": {
    "pattern-id": {}
}

caseSensitive (default: true)

Depending on the patternlab version, the headline is sometimes with real capitalization and sometimes just done with css. Which means if you switch it might introduce problems. By default patternlab-to-gemini is case-sensitive. With this config option it can be disabled.

"caseSensitive": false

templateFile (default: ./templates/main.js)

The path to the file where the templates for the tests.

"templateFile": "./templates/main.js"

Pattern specific configuration

These settings previously were part of the patternconfigfile.

loadOnSinglePage (default: false - if global loadOnSinglePage is also false)

If the screenshot of this pattern should be taken on a single page instead of the default styleguide page. This is necessary for patterns that have elements that are fixed or absolutely positioned.

⚠️ If this is active the selectors config has to be set also

⚠️ If the global loadOnSinglePage is activated this is always true, and can't be overwritten

screenSizes

An array of the globally defined screenSizes. This will overwrite the screen shot sizes for this pattern.

{
    "patterns": {
        "pattern-id": {
            "screenSizes": ["size1", "size2"]
        }
    }
}

⚠️ Can not be used with additionalScreenSizes or excludeScreenSizes on the same pattern. Pattern screen shot sizes can either be overwritten or modified, but not both.

additionalScreenSizes

An array of the globally defined screenSizes. These screen shots will be taken in addition to the defaultSizes.

{
    "patterns": {
        "pattern-id": {
            "additionalScreenSizes": ["size1", "size2"]
        }
    }
}

⚠️ Can not be used with screenSizes on the same pattern. Pattern screen shot sizes can either be overwritten or modified, but not both.

captureElements

An array of custom selectors which are use for the screenshot. By default we use the .sg-pattern-example inside the #pattern-id, or the body if loadOnSinglePage is active.

ignoreElements

An array of custom selectors which are ignored when comparing screenshots.

excludeScreenSizes

An array of the globally defined screenSizes. The screen shots in these sizes will not be taken if the are part of the defaultSizes.

{
    "patterns": {
        "pattern-id": {
            "excludeScreenSizes": ["size1", "size2"]
        }
    }
}

⚠️ Can not be used with screenSizes on the same pattern. Pattern screen shot sizes can either be overwritten or modified, but not both.

actions

An array of actions which should be used to generate test cases. Each action will be transformed into a new test suite. For more details see the Actions Documentation.

{
    "patterns": {
        "pattern-id": {
            "actions": [
                ...action settings...
            ]
        }
    }
}

skipBrowsers

An array of browsers for which the pattern should not be tested. The browsers are either defined just as a regexp string or as an object, containing a comment and the regexp. These have to match an browser id of your gemini config.

{
    "patterns": {
        "pattern-id": {
            "skipBrowsers": [
                "chrome",
                {
                    "comment": "ie10 does not properly handle this pattern",
                    "browser": "internetExplorer10"
                }
            ]
        }
    }
}