htmlcsstest.cpp

Go to the documentation of this file.

/*******************************************************************************
Copyright (c) 2021, Jan Koester jan.koester@gmx.net
All rights reserved.
 
Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions are met:
    * Redistributions of source code must retain the above copyright
      notice, this list of conditions and the following disclaimer.
    * Redistributions in binary form must reproduce the above copyright
      notice, this list of conditions and the following disclaimer in the
      documentation and/or other materials provided with the distribution.
    * Neither the name of the <organization> nor the
      names of its contributors may be used to endorse or promote products
      derived from this software without specific prior written permission.
 
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL <COPYRIGHT HOLDER> BE LIABLE FOR ANY
DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*******************************************************************************/
 
#include <iostream>
#include <set>
 
#include "../src/html.h"
#include "../src/css.h"
#include "../src/htmlcss.h"
 
#define Red     "\033[0;31m"
#define Green   "\033[0;32m"
#define NOCOLOR "\033[0m"
 
static int testCount = 0;
static int passCount = 0;
 
static void check(bool cond, const char *desc) {
    ++testCount;
    if (cond) {
        ++passCount;
        std::cout << Green << "  PASS: " << desc << NOCOLOR << std::endl;
    } else {
        std::cout << Red   << "  FAIL: " << desc << NOCOLOR << std::endl;
    }
}
 
int main(){
    // --- approximateSelectorMatch: tag/class/id/compound ---
    std::cout << "=== approximateSelectorMatch ===" << std::endl;
    {
        using libhtmlpp::CSSStyleSheet;
        std::vector<std::string> classes = {"card", "featured"};
 
        check(CSSStyleSheet::approximateSelectorMatch("div", "div", classes, "hero"),
              "bare tag matches");
        check(!CSSStyleSheet::approximateSelectorMatch("span", "div", classes, "hero"),
              "wrong tag doesn't match");
        check(CSSStyleSheet::approximateSelectorMatch(".card", "div", classes, "hero"),
              "single class matches");
        check(CSSStyleSheet::approximateSelectorMatch(".card.featured", "div", classes, "hero"),
              "every class in compound must be present -- matches when all are");
        check(!CSSStyleSheet::approximateSelectorMatch(".card.missing", "div", classes, "hero"),
              "every class in compound must be present -- rejects when one is absent");
        check(CSSStyleSheet::approximateSelectorMatch("#hero", "div", classes, "hero"),
              "id selector matches");
        check(CSSStyleSheet::approximateSelectorMatch("div.card.featured#hero", "div", classes, "hero"),
              "full compound tag.class.class#id matches");
        check(CSSStyleSheet::approximateSelectorMatch(".other, .card", "div", classes, "hero"),
              "comma list matches if any branch matches");
    }
 
    // --- Unsupported syntax is rejected, never guessed ---
    std::cout << "=== approximateSelectorMatch rejects unsafe syntax ===" << std::endl;
    {
        using libhtmlpp::CSSStyleSheet;
        std::vector<std::string> classes = {"card"};
        check(!CSSStyleSheet::approximateSelectorMatch("[data-x]", "div", classes, ""),
              "attribute selector rejected");
        check(!CSSStyleSheet::approximateSelectorMatch("div:hover", "div", classes, ""),
              "pseudo-class rejected");
        check(!CSSStyleSheet::approximateSelectorMatch("*", "div", classes, ""),
              "universal selector rejected");
        check(!CSSStyleSheet::approximateSelectorMatch("[data-atom=header]>div", "div", classes, ""),
              "bare tag left after a combinator is rejected (would over-match every element of that tag)");
        check(CSSStyleSheet::approximateSelectorMatch("[data-atom=header]>div.card", "div", classes, ""),
              "a qualified compound after a combinator is still specific enough to check");
    }
 
    // --- collectApproximateMatches: cascade priority ---
    std::cout << "=== collectApproximateMatches cascade ===" << std::endl;
    {
        using libhtmlpp::CSSStyleSheet;
        std::string css =
            ".box { color: red; font-size: 12px; }\n"
            ".box { color: blue; }\n";
        CSSStyleSheet sheet;
        sheet.parse(css);
 
        std::map<std::string,std::string> props;
        props["color"] = "inline-value"; // simulates an inline style="" already present
        std::string mediaRules;
        std::set<std::string> seen;
        sheet.collectApproximateMatches("div", "box", "hero", props, mediaRules, seen);
 
        check(props["color"] == "inline-value",
              "inline value beats a later plain (non-important) rule");
        check(props["font-size"] == "12px", "non-conflicting property still merged in");
    }
    {
        using libhtmlpp::CSSStyleSheet;
        std::string css = "#hero { color: green !important; }\n";
        CSSStyleSheet sheet;
        sheet.parse(css);
 
        std::map<std::string,std::string> props;
        props["color"] = "inline-value";
        std::string mediaRules;
        std::set<std::string> seen;
        sheet.collectApproximateMatches("div", "box", "hero", props, mediaRules, seen);
 
        check(props["color"] == "green",
              "an !important rule overrides even an inline-set value (matches real cascade precedence)");
    }
    {
        using libhtmlpp::CSSStyleSheet;
        std::string css =
            ".box { color: red; }\n"
            ".box { color: blue; }\n";
        CSSStyleSheet sheet;
        sheet.parse(css);
 
        std::map<std::string,std::string> props; // no inline style
        std::string mediaRules;
        std::set<std::string> seen;
        sheet.collectApproximateMatches("div", "box", "", props, mediaRules, seen);
 
        check(props["color"] == "blue", "later plain rule wins over an earlier plain rule");
    }
    {
        using libhtmlpp::CSSStyleSheet;
        std::string css =
            ".box { color: red !important; }\n"
            ".box { color: blue; }\n";
        CSSStyleSheet sheet;
        sheet.parse(css);
 
        std::map<std::string,std::string> props;
        std::string mediaRules;
        std::set<std::string> seen;
        sheet.collectApproximateMatches("div", "box", "", props, mediaRules, seen);
 
        check(props["color"] == "red", "!important beats a later plain rule");
    }
 
    // --- @media dedup ---
    std::cout << "=== collectApproximateMatches @media dedup ===" << std::endl;
    {
        using libhtmlpp::CSSStyleSheet;
        std::string css = "@media (max-width: 600px) { .box { color: red; } }";
        CSSStyleSheet sheet;
        sheet.parse(css);
 
        std::set<std::string> seen;
        for (int i = 0; i < 3; ++i) {
            std::map<std::string,std::string> props;
            std::string mediaRules;
            sheet.collectApproximateMatches("div", "box", "", props, mediaRules, seen);
            check((i == 0) == !mediaRules.empty(),
                  "media block text only appended the first time it's seen");
        }
        check(seen.size() == 1, "seenMediaBlocks accumulated exactly one block");
    }
 
    // --- collectStyleBlocks + getCSSRules end-to-end ---
    std::cout << "=== collectStyleBlocks + getCSSRules ===" << std::endl;
    {
        std::string html =
            "<html><head>"
            "<style>.card { color: red; } #hero { font-size: 20px; }</style>"
            "</head><body>"
            "<div id=\"hero\" class=\"card\" style=\"margin: 0\">hi</div>"
            "</body></html>";
 
        libhtmlpp::HtmlString htmlString(html);
        libhtmlpp::Element &root = htmlString.parse();
 
        libhtmlpp::CSSStyleSheet sheet;
        libhtmlpp::collectStyleBlocks(sheet, root);
        check(sheet.getRuleCount() == 2, "collected both <style> block rules");
 
        libhtmlpp::HtmlElement *target = static_cast<libhtmlpp::HtmlElement*>(&root)->getElementbyID("hero");
        check(target != nullptr, "found target element by id");
 
        if (target) {
            std::set<std::string> seen;
            auto result = libhtmlpp::getCSSRules(*target, sheet, seen);
            check(result.properties["color"] == "red", "getCSSRules folds in matching <style> block rule by class");
            check(result.properties["font-size"] == "20px", "getCSSRules folds in matching <style> block rule by id");
            check(result.properties["margin"] == "0", "getCSSRules includes the element's own inline style");
        }
    }
 
    // --- resolveCSSVariables ---
    std::cout << "=== resolveCSSVariables ===" << std::endl;
    {
        std::map<std::string,std::string> props = {{"--color-bg", "0,0,0"}, {"--alpha-bg", "1"}};
        check(libhtmlpp::resolveCSSVariables("rgba(var(--color-bg),var(--alpha-bg))", props) ==
              "rgba(0,0,0,1)",
              "simple substitution, multiple var() in one value");
    }
    {
        std::map<std::string,std::string> props;
        check(libhtmlpp::resolveCSSVariables("var(--undefined, blue)", props) == "blue",
              "fallback used when the referenced name is unset");
    }
    {
        std::map<std::string,std::string> props;
        check(libhtmlpp::resolveCSSVariables("var(--undefined)", props) == "",
              "no fallback and unset name resolves to empty (invalid, per spec)");
    }
    {
        // Mirrors the real-world pattern: --gradient-bg's OWN stored value
        // references --color-bg/--alpha-bg (multi-hop resolution).
        std::map<std::string,std::string> props = {
            {"--color-bg", "10,20,30"},
            {"--alpha-bg", "0.5"},
            {"--gradient-bg", "rgba(var(--color-bg),var(--alpha-bg))"},
        };
        check(libhtmlpp::resolveCSSVariables("var(--gradient-bg)", props) == "rgba(10,20,30,0.5)",
              "multi-hop resolution through an intermediate custom property");
    }
    {
        // Fallback itself contains a nested var() -- also resolved.
        std::map<std::string,std::string> props = {{"--color-bg", "0,0,0"}};
        check(libhtmlpp::resolveCSSVariables(
                  "var(--gradient-bg, rgba(var(--color-bg),1))", props) == "rgba(0,0,0,1)",
              "nested var() inside a fallback value is resolved too");
    }
    {
        // a -> var(b), b -> var(a): cyclic, must not infinite-loop.
        std::map<std::string,std::string> props = {{"--a", "var(--b)"}, {"--b", "var(--a)"}};
        check(libhtmlpp::resolveCSSVariables("var(--a)", props) == "",
              "cyclic custom-property reference resolves to empty instead of looping forever");
    }
    {
        check(libhtmlpp::resolveCSSVariables("10px solid red", {}) == "10px solid red",
              "a value with no var( at all is returned unchanged");
    }
 
    // --- Summary ---
    std::cout << "\n=== " << passCount << "/" << testCount << " tests passed ===" << std::endl;
 
    return (passCount == testCount) ? 0 : -1;
}