004_0001 - InlineStylePropertyUsed

Inline style property used

Use generic classes instead, defined by the theme.

Metadata

authors:
- Xiwen Cheng <x@cinaq.com>
category: Maintainability
input: '**/*$Page.yaml'
rulename: InlineStylePropertyUsed
rulenumber: '004_0001'
scope: package
severity: MEDIUM

Description

Avoid using the style property, because this will make the life of your UI designer a lot more complicated. It will be harder to overrule styles from CSS file level.

Remediation

Use generic classes instead, defined by the theme.

Test cases

package app.mendix.pages.inline_style_property_used
import rego.v1


# Test data
form_simple = {
    "$Type": "Forms$Page",
    "Name": "Page1",
    "Appearance": {
        "$Type": "Forms$Appearance",
        "Class": "",
        "DesignProperties": null,
        "DynamicClasses": "",
        "Style": "",
    },
}
form_simple_negative = {
    "$Type": "Forms$Page",
    "Name": "Page1",
    "Appearance": {
        "$Type": "Forms$Appearance",
        "Class": "",
        "DesignProperties": null,
        "DynamicClasses": "",
        "Style": "color: red;",
    },
}

form_nested = {
    "Name": "Page1",
    "FormCall": {
        "Arguments": [
            {
                "Widgets": [
                    {
                        "$Type": "Forms$LayoutGrid",
                        "Name": "layoutGrid2",
                        "Rows": [
                            {
                                "$Type": "Forms$LayoutGridRow",
                                "Columns": [
                                    {
                                        "$Type": "Forms$LayoutGridColumn",
                                        "Appearance": {
                                            "$Type": "Forms$Appearance",
                                            "Class": "",
                                            "DesignProperties": null,
                                            "DynamicClasses": "",
                                            "Style": "",
                                        }
                                    },
                                ],
                            },
                        ],
                    },
                ],
            },
        ],
    },
}

form_nested_negative = {
    "Name": "Page1",
    "FormCall": {
        "Arguments": [
            {
                "Widgets": [
                    {
                        "$Type": "Forms$LayoutGrid",
                        "Name": "layoutGrid2",
                        "Rows": [
                            {
                                "$Type": "Forms$LayoutGridRow",
                                "Columns": [
                                    {
                                        "$Type": "Forms$LayoutGridColumn",
                                        "Appearance": {
                                            "$Type": "Forms$Appearance",
                                            "Class": "",
                                            "DesignProperties": null,
                                            "DynamicClasses": "",
                                            "Style": "color: orange;",
                                        }
                                    },
                                ],
                            },
                        ],
                    },
                ],
            },
        ],
    },
}



# Test cases
test_simple if {
    allow with input as form_simple
}

test_simple_negative if {
    not allow with input as form_simple_negative
}

test_nested if {
    allow with input as form_nested
}

test_nested_negative if {
    not allow with input as form_nested_negative
}