Views

A View is a combination of resources for a particular presentation. It is suitable for anonymous viewing of content. It uses the flexibility of the JSON API specification to include a basket of related resources in a response, but doesn’t use the offical method of Inclusion of Related Resources.

View a Feature

This view collects the data for a feature, including the related resources needed to display it on MDN.

Here is a simple example, the view for the CSS property float:

GET /api/v1/view_features/5 HTTP/1.1
Host: browsercompat.org
Accept: application/vnd.api+json

A sample response is:

HTTP/1.1 200 OK
Content-Type: application/vnd.api+json
{
    "features": {
        "id": "5",
        "slug": "web-css-float",
        "mdn_uri": {
            "en": "https://developer.mozilla.org/en-US/docs/Web/CSS/float",
            "de": "https://developer.mozilla.org/de/docs/Web/CSS/float",
            "es": "https://developer.mozilla.org/es/docs/Web/CSS/float",
            "ja": "https://developer.mozilla.org/ja/docs/Web/CSS/float",
            "ru": "https://developer.mozilla.org/ru/docs/Web/CSS/float"
        },
        "experimental": false,
        "standardized": true,
        "stable": true,
        "obsolete": false,
        "name": "float",
        "links": {
            "sections": [
                "1",
                "2",
                "3"
            ],
            "supports": [],
            "parent": "2",
            "children": [
                "6"
            ],
            "history_current": "5",
            "history": [
                "5"
            ]
        }
    },
    "links": {
        "features.sections": {
            "type": "sections",
            "href": "https://browsercompat.org/api/v1/sections/{features.sections}"
        },
        "features.supports": {
            "type": "supports",
            "href": "https://browsercompat.org/api/v1/supports/{features.supports}"
        },
        "features.parent": {
            "type": "features",
            "href": "https://browsercompat.org/api/v1/features/{features.parent}"
        },
        "features.children": {
            "type": "features",
            "href": "https://browsercompat.org/api/v1/features/{features.children}"
        },
        "features.history_current": {
            "type": "historical_features",
            "href": "https://browsercompat.org/api/v1/historical_features/{features.history_current}"
        },
        "features.history": {
            "type": "historical_features",
            "href": "https://browsercompat.org/api/v1/historical_features/{features.history}"
        },
        "browsers.history": {
            "type": "historical_browsers",
            "href": "https://browsercompat.org/api/v1/historical_browsers/{browsers.history}"
        },
        "browsers.history_current": {
            "type": "historical_browsers",
            "href": "https://browsercompat.org/api/v1/historical_browsers/{browsers.history_current}"
        },
        "versions.browser": {
            "type": "browsers",
            "href": "https://browsercompat.org/api/v1/browsers/{versions.browser}"
        },
        "versions.history": {
            "type": "historical_versions",
            "href": "https://browsercompat.org/api/v1/historical_versions/{versions.history}"
        },
        "versions.history_current": {
            "type": "historical_versions",
            "href": "https://browsercompat.org/api/v1/historical_versions/{versions.history_current}"
        },
        "supports.version": {
            "type": "versions",
            "href": "https://browsercompat.org/api/v1/versions/{supports.version}"
        },
        "supports.feature": {
            "type": "features",
            "href": "https://browsercompat.org/api/v1/features/{supports.feature}"
        },
        "supports.history_current": {
            "type": "historical_supports",
            "href": "https://browsercompat.org/api/v1/historical_supports/{supports.history_current}"
        },
        "supports.history": {
            "type": "historical_supports",
            "href": "https://browsercompat.org/api/v1/historical_supports/{supports.history}"
        },
        "maturities.history_current": {
            "type": "historical_maturities",
            "href": "https://browsercompat.org/api/v1/historical_maturities/{maturities.history_current}"
        },
        "maturities.history": {
            "type": "historical_maturities",
            "href": "https://browsercompat.org/api/v1/historical_maturities/{maturities.history}"
        },
        "specifications.maturity": {
            "type": "maturities",
            "href": "https://browsercompat.org/api/v1/maturities/{specifications.maturity}"
        },
        "specifications.history_current": {
            "type": "historical_specifications",
            "href": "https://browsercompat.org/api/v1/historical_specifications/{specifications.history_current}"
        },
        "specifications.history": {
            "type": "historical_specifications",
            "href": "https://browsercompat.org/api/v1/historical_specifications/{specifications.history}"
        },
        "sections.specification": {
            "type": "specifications",
            "href": "https://browsercompat.org/api/v1/specifications/{sections.specification}"
        },
        "sections.history_current": {
            "type": "historical_sections",
            "href": "https://browsercompat.org/api/v1/historical_sections/{sections.history_current}"
        },
        "sections.history": {
            "type": "historical_sections",
            "href": "https://browsercompat.org/api/v1/historical_sections/{sections.history}"
        }
    },
    "linked": {
        "browsers": [
            {
                "id": "1",
                "slug": "android",
                "name": {
                    "en": "Android Browser"
                },
                "note": null,
                "links": {
                    "history": [
                        "1"
                    ],
                    "history_current": "1"
                }
            },
            {
                "id": "2",
                "slug": "android_webview",
                "name": {
                    "en": "Android Webview"
                },
                "note": null,
                "links": {
                    "history": [
                        "2"
                    ],
                    "history_current": "2"
                }
            },
            {
                "id": "4",
                "slug": "chrome_desktop",
                "name": {
                    "en": "Chrome for Desktop"
                },
                "note": null,
                "links": {
                    "history": [
                        "4"
                    ],
                    "history_current": "4"
                }
            },
            {
                "id": "6",
                "slug": "firefox_android",
                "name": {
                    "en": "Firefox for Android"
                },
                "note": null,
                "links": {
                    "history": [
                        "6"
                    ],
                    "history_current": "6"
                }
            },
            {
                "id": "7",
                "slug": "firefox_desktop",
                "name": {
                    "en": "Firefox for Desktop"
                },
                "note": null,
                "links": {
                    "history": [
                        "7"
                    ],
                    "history_current": "7"
                }
            },
            {
                "id": "9",
                "slug": "ie_desktop",
                "name": {
                    "en": "Internet Explorer for Desktop"
                },
                "note": null,
                "links": {
                    "history": [
                        "22",
                        "21",
                        "20",
                        "19",
                        "9"
                    ],
                    "history_current": "22"
                }
            },
            {
                "id": "10",
                "slug": "ie_mobile",
                "name": {
                    "en": "Internet Explorer Mobile"
                },
                "note": null,
                "links": {
                    "history": [
                        "10"
                    ],
                    "history_current": "10"
                }
            },
            {
                "id": "11",
                "slug": "opera_desktop",
                "name": {
                    "en": "Opera for Desktop"
                },
                "note": null,
                "links": {
                    "history": [
                        "11"
                    ],
                    "history_current": "11"
                }
            },
            {
                "id": "14",
                "slug": "safari_desktop",
                "name": {
                    "en": "Safari for Desktop"
                },
                "note": null,
                "links": {
                    "history": [
                        "14"
                    ],
                    "history_current": "14"
                }
            },
            {
                "id": "15",
                "slug": "safari_ios",
                "name": {
                    "en": "Safari for iOS"
                },
                "note": null,
                "links": {
                    "history": [
                        "15"
                    ],
                    "history_current": "15"
                }
            }
        ],
        "versions": [
            {
                "id": "2",
                "version": "1.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "1",
                    "history": [
                        "2"
                    ],
                    "history_current": "2"
                }
            },
            {
                "id": "4",
                "version": "current",
                "release_day": null,
                "retirement_day": null,
                "status": "current",
                "release_notes_uri": null,
                "note": null,
                "order": 0,
                "links": {
                    "browser": "2",
                    "history": [
                        "4"
                    ],
                    "history_current": "4"
                }
            },
            {
                "id": "9",
                "version": "1.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "4",
                    "history": [
                        "9"
                    ],
                    "history_current": "9"
                }
            },
            {
                "id": "15",
                "version": "1.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "6",
                    "history": [
                        "15"
                    ],
                    "history_current": "15"
                }
            },
            {
                "id": "18",
                "version": "1.0",
                "release_day": "2004-11-09",
                "retirement_day": "2005-11-29",
                "status": "retired",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "7",
                    "history": [
                        "18"
                    ],
                    "history_current": "18"
                }
            },
            {
                "id": "26",
                "version": "4.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "9",
                    "history": [
                        "26"
                    ],
                    "history_current": "26"
                }
            },
            {
                "id": "32",
                "version": "6.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 2,
                "links": {
                    "browser": "10",
                    "history": [
                        "32"
                    ],
                    "history_current": "32"
                }
            },
            {
                "id": "34",
                "version": "7.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "11",
                    "history": [
                        "34"
                    ],
                    "history_current": "34"
                }
            },
            {
                "id": "42",
                "version": "1.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "14",
                    "history": [
                        "42"
                    ],
                    "history_current": "42"
                }
            },
            {
                "id": "44",
                "version": "5.1",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 3,
                "links": {
                    "browser": "14",
                    "history": [
                        "44"
                    ],
                    "history_current": "44"
                }
            },
            {
                "id": "46",
                "version": "1.0",
                "release_day": null,
                "retirement_day": null,
                "status": "unknown",
                "release_notes_uri": null,
                "note": null,
                "order": 1,
                "links": {
                    "browser": "15",
                    "history": [
                        "46"
                    ],
                    "history_current": "46"
                }
            }
        ],
        "supports": [
            {
                "id": "1",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "2",
                    "feature": "6",
                    "history_current": "1",
                    "history": [
                        "1"
                    ]
                }
            },
            {
                "id": "2",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "9",
                    "feature": "6",
                    "history_current": "2",
                    "history": [
                        "2"
                    ]
                }
            },
            {
                "id": "3",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "15",
                    "feature": "6",
                    "history_current": "3",
                    "history": [
                        "3"
                    ]
                }
            },
            {
                "id": "4",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "18",
                    "feature": "6",
                    "history_current": "4",
                    "history": [
                        "4"
                    ]
                }
            },
            {
                "id": "5",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "26",
                    "feature": "6",
                    "history_current": "5",
                    "history": [
                        "5"
                    ]
                }
            },
            {
                "id": "6",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "32",
                    "feature": "6",
                    "history_current": "6",
                    "history": [
                        "6"
                    ]
                }
            },
            {
                "id": "7",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "34",
                    "feature": "6",
                    "history_current": "7",
                    "history": [
                        "7"
                    ]
                }
            },
            {
                "id": "8",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "42",
                    "feature": "6",
                    "history_current": "8",
                    "history": [
                        "8"
                    ]
                }
            },
            {
                "id": "9",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "44",
                    "feature": "6",
                    "history_current": "9",
                    "history": [
                        "9"
                    ]
                }
            },
            {
                "id": "10",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "46",
                    "feature": "6",
                    "history_current": "10",
                    "history": [
                        "10"
                    ]
                }
            },
            {
                "id": "27",
                "support": "yes",
                "prefix": null,
                "prefix_mandatory": false,
                "alternate_name": null,
                "alternate_mandatory": false,
                "requires_config": null,
                "default_config": null,
                "protected": false,
                "note": null,
                "links": {
                    "version": "4",
                    "feature": "6",
                    "history_current": "27",
                    "history": [
                        "27"
                    ]
                }
            }
        ],
        "maturities": [
            {
                "id": "1",
                "slug": "REC",
                "name": {
                    "en": "Recommendation",
                    "de": "Empfehlung",
                    "ja": "勧告",
                    "ru": "Рекомендация"
                },
                "links": {
                    "history_current": "1",
                    "history": [
                        "1"
                    ]
                }
            },
            {
                "id": "2",
                "slug": "WD",
                "name": {
                    "en": "Working Draft",
                    "de": "Arbeitsentwurf",
                    "ja": "草案",
                    "ru": "Рабочий черновик"
                },
                "links": {
                    "history_current": "2",
                    "history": [
                        "2"
                    ]
                }
            }
        ],
        "specifications": [
            {
                "id": "1",
                "slug": "css1",
                "mdn_key": "CSS1",
                "name": {
                    "en": "CSS Level 1"
                },
                "uri": {
                    "en": "http://www.w3.org/TR/CSS1/"
                },
                "links": {
                    "maturity": "1",
                    "history_current": "1",
                    "history": [
                        "1"
                    ]
                }
            },
            {
                "id": "2",
                "slug": "css2_1",
                "mdn_key": "CSS2.1",
                "name": {
                    "en": "CSS Level 2 (Revision 1)"
                },
                "uri": {
                    "en": "http://www.w3.org/TR/CSS2/"
                },
                "links": {
                    "maturity": "1",
                    "history_current": "2",
                    "history": [
                        "2"
                    ]
                }
            },
            {
                "id": "3",
                "slug": "css3_box",
                "mdn_key": "CSS3 Box",
                "name": {
                    "en": "CSS Basic Box Model"
                },
                "uri": {
                    "en": "http://dev.w3.org/csswg/css3-box/"
                },
                "links": {
                    "maturity": "2",
                    "history_current": "3",
                    "history": [
                        "3"
                    ]
                }
            }
        ],
        "sections": [
            {
                "id": "1",
                "number": {
                    "en": "5.5.25"
                },
                "name": {
                    "en": "'float'"
                },
                "subpath": {
                    "en": "#float"
                },
                "note": {
                    "en": "Initial definition."
                },
                "links": {
                    "specification": "1",
                    "history_current": "1",
                    "history": [
                        "1"
                    ]
                }
            },
            {
                "id": "2",
                "number": {
                    "en": "9.5.1"
                },
                "name": {
                    "en": "Positioning the float: the 'float' property"
                },
                "subpath": {
                    "en": "visuren.html#float-position"
                },
                "note": {
                    "en": "No change."
                },
                "links": {
                    "specification": "2",
                    "history_current": "2",
                    "history": [
                        "2"
                    ]
                }
            },
            {
                "id": "3",
                "number": {
                    "en": "16"
                },
                "name": {
                    "en": "The float property"
                },
                "subpath": {
                    "en": "#the-float-property"
                },
                "note": {
                    "en": "Lots of new values, not all clearly defined yet. Any differences in behavior unrelated to new features are expected to be unintentional; please report."
                },
                "links": {
                    "specification": "3",
                    "history_current": "3",
                    "history": [
                        "3"
                    ]
                }
            }
        ],
        "features": [
            {
                "id": "6",
                "slug": "web-css-float_basic-support",
                "mdn_uri": null,
                "experimental": false,
                "standardized": true,
                "stable": true,
                "obsolete": false,
                "name": {
                    "en": "Basic Support",
                    "ja": "基本サポート"
                },
                "links": {
                    "sections": [],
                    "supports": [
                        "1",
                        "2",
                        "3",
                        "4",
                        "5",
                        "6",
                        "7",
                        "8",
                        "9",
                        "10",
                        "27"
                    ],
                    "parent": "5",
                    "children": [],
                    "history_current": "6",
                    "history": [
                        "6"
                    ]
                }
            }
        ]
    },
    "meta": {
        "compat_table": {
            "supports": {
                "5": {},
                "6": {
                    "1": [
                        "1"
                    ],
                    "2": [
                        "27"
                    ],
                    "4": [
                        "2"
                    ],
                    "6": [
                        "3"
                    ],
                    "7": [
                        "4"
                    ],
                    "9": [
                        "5"
                    ],
                    "10": [
                        "6"
                    ],
                    "11": [
                        "7"
                    ],
                    "14": [
                        "8"
                    ],
                    "15": [
                        "10"
                    ]
                }
            },
            "tabs": [
                {
                    "name": {
                        "en": "Desktop Browsers"
                    },
                    "browsers": [
                        "4",
                        "7",
                        "9",
                        "11",
                        "14"
                    ]
                },
                {
                    "name": {
                        "en": "Mobile Browsers"
                    },
                    "browsers": [
                        "1",
                        "2",
                        "6",
                        "10",
                        "15"
                    ]
                }
            ],
            "child_pages": false,
            "pagination": {
                "linked.features": {
                    "previous": null,
                    "next": null,
                    "count": 1
                }
            },
            "languages": [
                "en",
                "de",
                "es",
                "ja",
                "ru"
            ],
            "notes": {}
        }
    }
}

One way to use this representation is:

  1. Parse into an in-memory object store,

  2. Create the “Specifications” section:
    1. Add the Specifications header

    2. Create an HTML table with a header row “Specification”, “Status”, “Comment”

    3. For each id in features.links.sections (["746", "421", "70"]):
      • Add the first column: a link to specifications.uri.(lang or en) + sections.subpath.(lang or en), with link text specifications.name.(lang or en), with title based on sections.name.(lang or en) or feature.name.(lang or en).
      • Add the second column: A span with class “spec-” + maturities.slug, and the text maturities.name.(lang or en).
      • Add the third column: maturities.notes.(lang or en), or empty string
    4. Close the table, and add an edit button.

  3. Create the Browser Compatibility section:
    1. Add The “Browser compatibility” header

    2. For each item in meta.compat_table.tabs, create a table with the proper name (“Desktop”, “Mobile”)

    3. For each browser id in meta.compat-table.tabs.browsers, add a column with the translated browser name.

    4. For each feature in features.features:
      • Add the first column: the feature name. If it is a string, then wrap in <code>. Otherwise, use the best translation of feature.name, in a lang=(lang) block.

      • Add any feature flags, such as an obsolete or experimental icon, based on the feature flags.

      • For each browser id in meta.compat-table-important:
        • Get the important support IDs from meta.compat-table-important.supports.<feature ID>.<browser ID>
        • If null, then display ”?”
        • If just one, display “<version>”, or “<support>”, depending on the defined attributes
        • If multiple, display as subcells
        • Add prefixes, alternate names, config, ank notes link as appropriate
    5. Close each table, add an edit button

    6. Add notes for displayed supports

This may be done by including the JSON in the page as sent over the wire, or loaded asynchronously, with the tables built after initial page load.

This can also be used by a “caniuse” table layout by ignoring the meta section and displaying all the included data. This will require more client-side processing to generate, or additional data in the <meta> section.

Including Child Pages

By default, view_feature only includes row children, which are subfeatures that are represented as rows in the MDN table. These row children are identified by not having a value for mdn_uri.

There can also be page children, which are represented as more detailed page on MDN. For example, Web/CSS has the page child Web/CSS/Display. By default, these are not included, but can be included by setting the query parameter child_pages=1:

GET /api/v1/view_features/5?child_pages=1 HTTP/1.1
Host: browsercompat.org
Accept: application/vnd.api+json

Updating Views with Changesets

Updating the page requires a sequence of requests. For example, if a user wants to change Chrome support for <address> from an unknown version to version 1, you’ll have to create the version for that version, then add the support for the support.

The first step is to create a changeset as an authenticated user:

POST /api/v1/changesets HTTP/1.1
Host: browsercompat.org
Accept: application/vnd.api+json
Content-Length: 107
Content-Type: application/vnd.api+json
Cookie: csrftoken=p7FqFyNp6hZS0FJYKyQxVmLrZILldjqn; sessionid=wurexa2wq416ftlvd5plesngwa28183h
X-Csrftoken: p7FqFyNp6hZS0FJYKyQxVmLrZILldjqn
{
    "changesets": {
        "target_resource_type": "features",
        "target_resource_id": "5"
    }
}

A sample response is:

HTTP/1.1 201 CREATED
Content-Type: application/vnd.api+json
{
    "changesets": {
        "id": "36",
        "created": "2015-04-20T20:36:06.794827Z",
        "modified": "2015-04-20T20:36:06.795315Z",
        "closed": false,
        "target_resource_type": "features",
        "target_resource_id": 5,
        "links": {
            "user": "1",
            "historical_browsers": [],
            "historical_features": [],
            "historical_maturities": [],
            "historical_sections": [],
            "historical_specifications": [],
            "historical_supports": [],
            "historical_versions": []
        }
    },
    "links": {
        "changesets.user": {
            "type": "users",
            "href": "https://browsercompat.org/api/v1/users/{changesets.user}"
        },
        "changesets.historical_browsers": {
            "type": "historical_browsers",
            "href": "https://browsercompat.org/api/v1/historical_browsers/{changesets.historical_browsers}"
        },
        "changesets.historical_features": {
            "type": "historical_features",
            "href": "https://browsercompat.org/api/v1/historical_features/{changesets.historical_features}"
        },
        "changesets.historical_maturities": {
            "type": "historical_maturities",
            "href": "https://browsercompat.org/api/v1/historical_maturities/{changesets.historical_maturities}"
        },
        "changesets.historical_sections": {
            "type": "historical_sections",
            "href": "https://browsercompat.org/api/v1/historical_sections/{changesets.historical_sections}"
        },
        "changesets.historical_specifications": {
            "type": "historical_specifications",
            "href": "https://browsercompat.org/api/v1/historical_specifications/{changesets.historical_specifications}"
        },
        "changesets.historical_supports": {
            "type": "historical_supports",
            "href": "https://browsercompat.org/api/v1/historical_supports/{changesets.historical_supports}"
        },
        "changesets.historical_versions": {
            "type": "historical_versions",
            "href": "https://browsercompat.org/api/v1/historical_versions/{changesets.historical_versions}"
        }
    }
}

Next, use the changeset ID when creating the version:

POST /api/v1/versions?changeset=36 HTTP/1.1
Host: browsercompat.org
Accept: application/vnd.api+json
Content-Length: 138
Content-Type: application/vnd.api+json
Cookie: csrftoken=p7FqFyNp6hZS0FJYKyQxVmLrZILldjqn; sessionid=wurexa2wq416ftlvd5plesngwa28183h
X-Csrftoken: p7FqFyNp6hZS0FJYKyQxVmLrZILldjqn
{
    "versions": {
        "version": "2.0",
        "status": "retired",
        "links": {
            "browser": "3"
        }
    }
}

A sample response is:

HTTP/1.1 201 CREATED
Content-Type: application/vnd.api+json
{
    "versions": {
        "id": "50",
        "version": "2.0",
        "release_day": null,
        "retirement_day": null,
        "status": "retired",
        "release_notes_uri": null,
        "note": null,
        "order": 3,
        "links": {
            "browser": "3",
            "supports": [],
            "history": [
                "53"
            ],
            "history_current": "53"
        }
    },
    "links": {
        "versions.browser": {
            "type": "browsers",
            "href": "https://browsercompat.org/api/v1/browsers/{versions.browser}"
        },
        "versions.supports": {
            "type": "supports",
            "href": "https://browsercompat.org/api/v1/supports/{versions.supports}"
        },
        "versions.history": {
            "type": "historical_versions",
            "href": "https://browsercompat.org/api/v1/historical_versions/{versions.history}"
        },
        "versions.history_current": {
            "type": "historical_versions",
            "href": "https://browsercompat.org/api/v1/historical_versions/{versions.history_current}"
        }
    }
}

Finally, create the support:

POST /api/v1/supports?changeset=36 HTTP/1.1
Host: browsercompat.org
Accept: application/vnd.api+json
Content-Length: 112
Content-Type: application/vnd.api+json
Cookie: csrftoken=p7FqFyNp6hZS0FJYKyQxVmLrZILldjqn; sessionid=wurexa2wq416ftlvd5plesngwa28183h
X-Csrftoken: p7FqFyNp6hZS0FJYKyQxVmLrZILldjqn
{
    "supports": {
        "links": {
            "version": "50",
            "feature": "6"
        }
    }
}

A sample response is:

HTTP/1.1 201 CREATED
Content-Type: application/vnd.api+json
{
    "supports": {
        "id": "29",
        "support": "yes",
        "prefix": null,
        "prefix_mandatory": false,
        "alternate_name": null,
        "alternate_mandatory": false,
        "requires_config": null,
        "default_config": null,
        "protected": false,
        "note": null,
        "links": {
            "version": "50",
            "feature": "6",
            "history_current": "32",
            "history": [
                "32"
            ]
        }
    },
    "links": {
        "supports.version": {
            "type": "versions",
            "href": "https://browsercompat.org/api/v1/versions/{supports.version}"
        },
        "supports.feature": {
            "type": "features",
            "href": "https://browsercompat.org/api/v1/features/{supports.feature}"
        },
        "supports.history_current": {
            "type": "historical_supports",
            "href": "https://browsercompat.org/api/v1/historical_supports/{supports.history_current}"
        },
        "supports.history": {
            "type": "historical_supports",
            "href": "https://browsercompat.org/api/v1/historical_supports/{supports.history}"
        }
    }
}

The historical_versions and historical_supports resources will both refer to changeset 36, and this changeset is linked to feature 5, despite the fact that no changes were made to the feature. This will facilitate displaying a history of the compatibility tables, for the purpose of reviewing changes and reverting vandalism.

Updating View with PUT

view_features supports PUT for bulk updates of support data. Here is a simple example that adds a new subfeature without support:

PUT /api/v1/view_features/html-element-address HTTP/1.1
Host: browsersupports.org
Content-Type: application/vnd.api+json
Authorization: Bearer mF_9.B5f-4.1JqM
{
    "features": {
        "id": "816",
        "slug": "html-element-address",
        "mdn_uri": {
            "en": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/address"
        },
        "experimental": false,
        "standardized": true,
        "stable": true,
        "obsolete": false,
        "name": "address",
        "links": {
            "sections": ["746", "421", "70"],
            "supports": [],
            "parent": "800",
            "children": ["191"],
            "history_current": "216",
            "history": ["216"]
        }
    },
    "linked": {
        "features": [
            {
                "id": "_New Subfeature",
                "slug": "html-address-new-subfeature",
                "name": {
                    "en": "New Subfeature"
                },
                "links": {
                    "parent": "816"
                }
            }
        ]
    }
}

The response is the feature view with new and updated items, or an error response.

This is a trivial use case, which would be better implemented by creating the feature directly, but it can be extended to bulk updates of existing feature views, or for first-time importing of subfeatures and support data. It has some quirks:

  • New items should be identified with an ID starting with an underscore (_). Relations to new items should use the underscored IDs.
  • Only feature, support, and section resources can be added or updated. Features must be the target feature or a descendant, and supports and sections are restricted to those features.
  • Deletions are not supported.
  • Other resources (browsers, versions, etc) can not be added or changed. This includes adding links to new resources.

Once the MDN import is complete, this PUT interface will be deprecated in favor of direct POST and PUT to the standard resource API.