How to use insertStylesheets method in Cypress

Best JavaScript code snippet using cypress

publish.js

Source:publish.js Github

copy

Full Screen

1var config = require('./config.js'),2    namespaces = require('./namespaces.js'),3    utils = require('./utils.js'),4    processing = require('./processing.js'),5    fs = require('fs'),6    DOMParser = require('xmldom').DOMParser;7var conf;8function syntax() {9  console.error('Usage: node publish.js options');10  console.error('');11  console.error('Options:');12  console.error('  --list-pages             Print the names of all pages of the specification.');13  console.error('  --list-nontoc-pages      Print the names of all non-ToC pages of the');14  console.error('                             specification.');15  console.error('  --list-toc-pages         Print the names of all ToC pages of the ');16  console.error('                             specification.');17  console.error('  --list-resources         Print the names of all resource files/directories');18  console.error('                             to be copied to the publish directory.');19  console.error('  --list-definition-files  Print the names of all referenced definition XML ');20  console.error('                             files.');21  console.error('  --list-external-links    Print all of the external links used in the ');22  console.error('                             specification.');23  console.error('  --lint                   Lints the specification and prints any problems.');24  console.error('  --build [PAGE ...]       Builds the specified pages, or all pages if');25  console.error('                             none specified.');26  console.error('  --build-single-page      Builds the single page version of the ');27  console.error('                             specification.');28  console.error('  --local-style            Link to local W3C style sheets rather than w3.org.');29  console.error('  --help                   Show this message.');30}31function parseOptions() {32  var opts = { rest: [] };33  for (var i = 2; i < process.argv.length; i++) {34    switch (process.argv[i]) {35      case '--list-pages':36        opts.listPages = true;37        opts.listPagesToC = true;38        opts.listPagesNonToC = true;39        break;40      case '--list-nontoc-pages':41        opts.listPages = true;42        opts.listPagesNonToC = true;43        break;44      case '--list-toc-pages':45        opts.listPages = true;46        opts.listPagesToC = true;47        break;48      case '--list-resources':49        opts.listResources = true;50        break;51      case '--list-definition-files':52        opts.listDefinitionFiles = true;53        break;54      case '--list-external-links':55        opts.listExternalLinks = true;56        break;57      case '--lint':58        opts.lint = true;59        break;60      case '--build':61        opts.build = true;62        break;63      case '--build-single-page':64        opts.buildSinglePage = true;65        break;66      case '--local-style':67        opts.localStyle = true;68        break;69      case '--help':70        opts.help = true;71        break;72      default:73        if (process.argv[i][0] == '-') {74          syntax();75          process.exit(1);76        }77        opts.rest.push(process.argv[i]);78    }79  }80  return opts;81}82function listPages(toc, nontoc) {83  function include(page) {84    if (page == conf.tocPage || page == conf.index) {85      return toc;86    }87    return nontoc;88  }89  console.log(conf.pageOrder.filter(include).join('\n'));90}91function listResources() {92  console.log(conf.resources.join('\n'));93}94function listDefinitionFiles() {95  console.log(conf.definitionFiles.join('\n'));96}97function gatherAllLinks() {98  var locs = conf.locations.concat(conf.definitions.locations);99  conf.pageOrder.forEach(function(page) {100    var doc = conf.getPageDocument(page);101    utils.forEachNode(doc, function(n) {102      if (n.nodeType != n.ELEMENT_NODE ||103          n.localName != 'a' ||104          !n.hasAttribute('href')) {105        return;106      }107      var href = processing.resolveSpecRelativeLink(conf, n);108      if (href) {109        locs.push([href, n.ownerDocument.documentURI, n.lineNumber, n.columnNumber]);110        return;111      }112      href = n.getAttribute('href');113      if (/^(.*):/.test(href) &&114          RegExp.$1 != 'http' &&115          RegExp.$1 != 'https') {116        return;117      }118      locs.push([href, n.ownerDocument.documentURI, n.lineNumber, n.columnNumber]);119    });120  });121  return locs.sort(function(a, b) {122      if (a[1] < b[1]) return -1;123      if (a[1] > b[1]) return 1;124      if (a[2] < b[2]) return -1;125      if (a[2] > b[2]) return 1;126      if (a[3] < b[3]) return -1;127      if (a[3] > b[3]) return 1;128      return 0;129    })130}131function listExternalLinks() {132  gatherAllLinks().forEach(function(l) {133    if (/\/\//.test(l[0])) {134      console.log([l[1], l[2], l[3], l[0]].join(':'));135    }136  });137}138function lint(pages) {139  function checkLocalLink(href, doc, n) {140    if (/^([^/]+)\.html$/.test(href)) {141      // link to a chapter142      if (conf.pageOrder.indexOf(RegExp.$1) == -1) {143        utils.info('broken link ' + href, n);144      }145    } else if (/^([^/]+)\.html#(.*)$/.test(href)) {146      // link to an anchor in a chapter147      var fragment = RegExp.$2;148      if (conf.pageOrder.indexOf(RegExp.$1) == -1) {149        utils.info('broken link ' + href, n);150      } else {151        var otherPage = conf.getPageDocument(RegExp.$1);152        if (!otherPage.getElementById(fragment)) {153          utils.info('broken link ' + href + ' (fragment not found)', n);154        }155      }156    } else if (/^#(.*)$/.test(href)) {157      if (!doc || !doc.getElementById(RegExp.$1)) {158        utils.info('broken link ' + href + ' (fragment not found)', n);159      }160    }161  }162  conf.definitions.locations.forEach(function(l) {163    checkLocalLink(l[0], conf.getPageDocument(conf.index), l.slice(1));164  });165  pages.forEach(function(page) {166    var doc = conf.getPageDocument(page);167    utils.forEachNode(doc, function(n) {168      if (n.nodeType != n.ELEMENT_NODE) {169        return;170      }171      if (/^h[2-6]$/.test(n.localName) &&172          !n.hasAttribute('id')) {173        utils.info('heading element must have an id="" attribute', n);174      }175      if (n.localName == 'a' &&176          n.hasAttribute('href')) {177        var href = n.getAttribute('href');178        checkLocalLink(href, doc, n);179      }180    });181  });182}183function checkAllPagesValid(pages) {184  for (var i = 0; i < pages.length; i++) {185    if (!conf.pages[pages[i]]) {186      var invalid = [pages[i]];187      while (++i < pages.length) {188        if (!conf.pages[pages[i]]) {189          invalid.push(pages[i]);190        }191      }192      console.error('error: unknown page' + (invalid.length > 1 ? 's' : '') + ' ' + invalid.join(' '));193      process.exit(1);194    }195  }196}197function buildPages(pages) {198  pages = pages || conf.pageOrder.concat();199  checkAllPagesValid(pages);200  lint(pages);201  pages.forEach(buildPage);202}203function buildPage(page) {204  var doc = conf.getPageDocument(page);205  var outputFilename = conf.outputDirectory + page + '.html';206  [processing.insertPageComment,207   processing.insertSpecNameInTitle,208   processing.insertStyleSheets,209   processing.insertMathJaxScript,210   processing.insertW3CScript,211   processing.addBodyClass,212   processing.addExpanderScript,213   processing.addTableOfContents,214   processing.addHeaderFooter,215   processing.processReplacements,216   processing.processLinks,217   processing.processSpecRelativeLinks,218   processing.addSectionNumbers,219   processing.addIssueIDs,220   processing.formatQuotes,221   // processing.formatIDL,222   processing.formatMarkup].forEach(function(fn) { fn(conf, page, doc); });223  fs.writeFileSync(outputFilename, doc.toString());224}225function buildSinglePage() {226  var outputFilename = conf.outputDirectory + 'single-page.html';227  var parser = new DOMParser();228  parser.recordPositions = true;229  // New document.230  var doc = parser.parseFromString('<html><head></head><body></body></html>');231  var head = doc.documentElement.firstChild;232  var body = doc.documentElement.lastChild;233  // Add HTML doctype.234  doc.insertBefore(doc.implementation.createDocumentType("html", "", ""), doc.firstChild);235  var foundMathjax = false;236  // Add the contents of each published chapter.237  for (var i = 0; i < conf.pageOrder.length; i++) {238    var page = conf.pageOrder[i];239    var pageDocument = utils.parseXHTML(conf.outputDirectory + page + '.html');240    var pageHead = utils.child(pageDocument.documentElement, 'head');241    var pageBody = utils.child(pageDocument.documentElement, 'body');242    if (i == 0) {243      // The <head> contents of the index are used for the single page document.244      head.appendChild(utils.cloneChildren(pageHead));245    } else {246      // Separate each page.247      body.appendChild(utils.parse('<hr class="chapter-divider"/>'));248    }249    utils.forEachNode(pageHead, function(n) {250      // Copy a <style> or <link data-keep=""> in any chapter's <head>251      // into the single page <head>.252      // Place before any other style sheets because we must not override253      // the W3C TR style sheets.254      if ((n.nodeName == 'style')||255          (n.nodeName == 'link' && n.hasAttribute('data-keep')) ) {256        var firstStyleSheet = head.getElementsByTagName('link')[0];257        head.insertBefore(n.cloneNode(true), firstStyleSheet);258      }259      // Note if Mathjax was used anywhere.260      if (n.nodeName == 'script' &&261          n.hasAttribute('data-script-mathjax')) {262        foundMathjax = true;263      }264    });265    // Clone the body of the chapter.266    var clonedPageBody = utils.cloneChildren(pageBody);267    // Fix up IDs so that they don't clash between chapters.268    utils.forEachNode(clonedPageBody, function(n) {269      if (n.nodeType == n.ELEMENT_NODE) {270        ['id', 'aria-describedby'].forEach(function(attr) {271          if (n.hasAttribute(attr) && !n.hasAttribute('data-never-rename')) {272            n.setAttribute(attr, page + '-' + n.getAttribute(attr));273          }274        });275        if (n.nodeName == 'a') {276          if (n.hasAttribute('name')) {277            n.setAttribute('name', page + '-' + n.getAttribute('name'));278          }279          if (n.hasAttribute('href')) {280            var href = n.getAttribute('href');281            if (href[0] == '#') {282              n.setAttribute('href', '#' + page + '-' + href.substring(1));283            } else if (href.match(/^([^\/]+)\.html#(.*)$/)) {284              n.setAttribute('href', '#' + RegExp.$1 + '-' + RegExp.$2);285            } else if (href.match(/^([^\/]+)\.html$/) && RegExp.$1 != 'single-page') {286              n.setAttribute('href', '#chapter-' + RegExp.$1);287            }288          }289        }290      }291    });292    // Copy the chapter in.293    body.appendChild(utils.parse('<div id="chapter-{{page}}" class="{{classes}}">{{pagebody}}</div>',294                                 { page: page,295                                   classes: pageBody.getAttribute('class'),296                                   pagebody: clonedPageBody }));297  }298  // Remove all references to expanders.js and fixup.js.299  utils.forEachNode(doc, function(n) {300    if (301      n.nodeName == 'script' &&302      (303        n.getAttribute('src') == 'style/expanders.js' || 304        n.getAttribute('src') == '//www.w3.org/scripts/TR/2016/fixup.js'305      )306    ) {307      n.parentNode.removeChild(n);308    }309  });310  // Add one reference at the end of the document.311  body.appendChild(utils.parse('<script src="style/expanders.js"></script>'));312  body.appendChild(utils.parse('<script src="//www.w3.org/scripts/TR/2016/fixup.js"></script>'));313  // Add reference to mathjax if we found one in any chapter.314  if (foundMathjax) {315    head.appendChild( processing.getMathJaxScript() );316  }317  fs.writeFileSync(outputFilename, doc.toString());318}319/*320// Hacky function to do some automatic reformatting of source files.321function x() {322  function isBlock(n) {323    return n.localName == "div" ||324           n.localName == "dl" ||325           n.localName == "dt" ||326           n.localName == "dd" ||327           n.localName == "p" ||328           n.localName == "ul" ||329           n.localName == "ol" ||330           n.localName == "li" ||331           n.localName == "pre";332  }333  function reformat(n, level) {334    var indent = "", indentMinusOne = "", indentMinusTwo = "", indentPlusOne = "";335    for (var i = 0; i < level - 2; i++) {336      indentMinusTwo += "  ";337    }338    for (var i = 0; i < level - 1; i++) {339      indentMinusOne += "  ";340    }341    for (var i = 0; i < level; i++) {342      indent += "  ";343    }344    for (var i = 0; i < level + 1; i++) {345      indentPlusOne += "  ";346    }347    if (n.nodeType == n.TEXT_NODE) {348      var s = n.textContent;349      s = s.replace(/\n\n\n+/g, "\n\n");350      if (!n.previousSibling && n.parentNode.getAttribute("class") != "idl-type-parenthetical") {351        s = s.replace(/^\s+/, "");352      }353      s = s.replace(/\n *(\S)/g, function() { return "\n" + indentMinusTwo + RegExp.$1; });354      if (!n.nextSibling) {355        s = s.replace(/\s+$/, "");356      }357      if (s == "") {358        n.parentNode.removeChild(n);359      } else {360        utils.replace(n, n.ownerDocument.createTextNode(s));361      }362    }363    if (n.nodeType != n.ELEMENT_NODE) {364      return;365    }366    if (n.localName == "pre") {367      return;368    }369    for (var c = n.firstChild; c; c = c.nextSibling) {370      var nextLevel;371      if (c.nodeType == c.ELEMENT_NODE &&372          (c.localName == "with" ||373           (c.localName == "div" && c.hasAttribute("class") && /ready-for/.test(c.getAttribute("class"))) ||374           !isBlock(c))) {375        nextLevel = level;376      } else {377        nextLevel = level + 1;378      }379      reformat(c, nextLevel);380    }381    if (n.localName == "with") {382      if (n.firstChild) {383        if (n.firstChild.nodeType == n.TEXT_NODE) {384          n.firstChild.data = "\n\n" + n.firstChild.data;385        } else {386          n.insertBefore(n.ownerDocument.createTextNode("\n\n"), n.firstChild);387        }388      }389      if (n.lastChild) {390        if (n.lastChild.nodeType == n.TEXT_NODE) {391          n.lastChild.data += "\n\n";392        } else {393          n.appendChild(n.ownerDocument.createTextNode("\n\n"));394        }395      }396    } else if (isBlock(n)) {397      if (n.firstChild && n.firstChild.nodeType == n.TEXT_NODE && /^\s+$/.test(n.firstChild.data)) {398        n.firstChild.data = "\n" + indent;399      } else if (n.firstChild && n.firstChild.nodeType == n.ELEMENT_NODE && isBlock(n.firstChild)) {400        n.insertBefore(n.ownerDocument.createTextNode("\n" + indent), n.firstChild);401      }402      if (n.nextSibling && n.nextSibling.nodeType == n.TEXT_NODE && /^\s+$/.test(n.nextSibling) && n.nextSibling.nextSibling && isBlock(n.nextSibling.nextSibling)) {403        n.parentNode.removeChild(n.nextSibling);404      }405      if (n.nextSibling && n.nextSibling.nodeType == n.TEXT_NODE && /^\s+$/.test(n.nextSibling) && !n.nextSibling.nextSibling) {406        n.appendChild(n.ownerDocument.createTextNode("\n" + indentMinusOne));407      }408      if (n.nextSibling && n.nextSibling.nodeType == n.ELEMENT_NODE && isBlock(n.nextSibling)) {409        n.parentNode.insertBefore(n.ownerDocument.createTextNode("\n" + indentMinusOne), n.nextSibling);410      }411      if (n.lastChild && n.lastChild.nodeType == n.ELEMENT_NODE && isBlock(n.lastChild)) {412        n.appendChild(n.ownerDocument.createTextNode("\n" + indentMinusOne));413      }414    }415    if (n.lastChild && n.lastChild.previousSibling && n.lastChild.nodeType == n.TEXT_NODE && n.lastChild.previousSibling.nodeType == n.TEXT_NODE) {416      n.lastChild.previousSibling.data += n.lastChild.data;417      n.removeChild(n.lastChild);418    }419    if (n.previousSibling && n.previousSibling.nodeType == n.TEXT_NODE) {420      n.previousSibling.data = n.previousSibling.data.replace(/\n *$/, "\n" + indentMinusOne);421    }422    if (n.lastChild && n.lastChild.nodeType == n.TEXT_NODE && /\S/.test(n.lastChild.data)) {423      n.lastChild.data = n.lastChild.data.replace(/\s+$/, "");424    }425  }426  conf.pageOrder.forEach(function(page) {427    var doc = utils.parseXHTML(page + '.html');428    // Format the document from the "DOMInterfaces" element onwards.429    var h2 = doc.getElementById("DOMInterfaces") || doc.getElementById("idl") || doc.getElementById("BasicDOMInterfaces");430    if (!h2) {431      return;432    }433    for (var n = h2.nextSibling; n; n = n.nextSibling) {434      reformat(n, 0);435    }436    fs.writeFileSync(page + ".html.new", doc.toString());437  });438}439*/440var opts = parseOptions();441if (opts.help || (!!opts.listPages + !!opts.listResources + !!opts.listDefinitionFiles + !!opts.listExternalLinks + !!opts.lint + !!opts.build + !!opts.buildSinglePage) != 1) {442  syntax();443  process.exit(opts.help ? 0 : 1);444} else {445  conf = config.load('publish.xml');446  conf.localStyleSheets = opts.localStyle;447  if (opts.listPages) {448    listPages(opts.listPagesToC, opts.listPagesNonToC);449  } else if (opts.listResources) {450    listResources();451  } else if (opts.listDefinitionFiles) {452    listDefinitionFiles();453  } else if (opts.listExternalLinks) {454    listExternalLinks();455  } else if (opts.lint) {456    lint(conf.pageOrder);457  } else if (opts.build) {458    buildPages(opts.rest);459  } else if (opts.buildSinglePage) {460    buildSinglePage();461  }...

Full Screen

Full Screen

Pogdesign-Widgets.js

Source:Pogdesign-Widgets.js Github

copy

Full Screen

...247          element248        )) {249          return;250        }251        page.controller.insertStylesheets(page.shared.stylesheets(pageElement));252        pageElement.insertExternalLink(element);253        page.controller.loadClickEventOnLinkElement(pageElement);254      },255      canAddExternalLink(isInLocationPage, element) {256        if (!isInLocationPage()) {257          return false;258        }259        const noElementValue = 0;260        if ($(element).length === noElementValue) {261          return false;262        }263        return true;264      },265      extractSeasonAndEpisode(pageElement, element) {266        const seasonAndEpisode = pageElement.extractSeasonAndEpisode(element);267        if (typeof seasonAndEpisode === 'string') {268          show.setSeasonAndEpisode(seasonAndEpisode);269          return;270        }271        show.setSeasonAndEpisode(272          seasonAndEpisode.season,273          seasonAndEpisode.episode274        );275      },276      extractShow(pageElement, element) {277        page.controller.extractTitle(pageElement, element);278        page.controller.extractSeasonAndEpisode(pageElement, element);279      },280      extractTitle(pageElement, element) {281        const title = $.trim(pageElement.extractTitle(element));282        show.setTitle(title);283      },284      getExternalLinksPopup(pageElement, element) {285        page.controller.extractShow(pageElement, element);286        pageElement.displayExternalLinksPopup(element);287      },288      insertStylesheets(stylesheets) {289        const style = document.createElement('style');290        style.appendChild(document.createTextNode(stylesheets));291        (document.body || document.head || document.documentElement)292          .appendChild(style);293      },294      isInLocationPage(regex) {295        return regex.test(window.location.href);296      },297      loadClickEventOnLinkElement(pageElement) {298        $(`.${page.shared.externalLinksLinkClass}`)299          .on('click', function onClick(event) {300            event.preventDefault();301            externalLinks.close();302            // eslint-disable-next-line no-invalid-this...

Full Screen

Full Screen

main.js

Source:main.js Github

copy

Full Screen

...104			}105			// 2.4. Add stylesheets and debugger106			if (DEBUG) console.log(log, '[2.4] -> Add game requirements');107			// add required CSS for game108			FS_String.insertStylesheets();109			// add html for game110			Interface.addBaseHTML();111			// add debugger to page and update112			Debug.add();113			Debug.update();114			// now safe to add Tally115			addTallyToPage();116		} catch (err) {117			console.error(err);118		}119	}120	const ignoreFiletypes = [121		"jpg", "gif", "png", "pdf",122		"xml", "json", "txt",...

Full Screen

Full Screen

screen-animator.js

Source:screen-animator.js Github

copy

Full Screen

1import { GDGotoScreenAction, GDModelObject } from './model.js';2import { cssClassNameForCell } from './styling.js';3/**4    Used for Screen-transitions (see GDGotoScreenAction). This one is used in the5    exported WebViewer, GDEditModeScreenAnimator is used in LivePreview/In-Place-Presentation-Mode.6    Normally, <body> contains the current screen. In case of a screen-transition 7    we move the content of the body (old screen) into a div, the new screen in 8    another div, animate both (or one, depending on the transition) and when 9    the animation finishes we delete the old-screen-div and move the contents of 10    the new screen-div into the body11*/12export class GDScreenAnimator {13    constructor(at, transition, duration) {14        this.at = at;15        this.transition = transition;16        this.duration = duration;17    }18    /**19        Converts between out transition constant (@link GDGotoScreenAction} and20        CSS-animation-classes.21        @return {Array} [oldScreenAnimation, newScreenAnimation]22    */23    convertTransitionToAnimationClasses() {24        let oldScreenAnimation = "";25        let newScreenAnimation = "";26        let oldOnTop = false;27        switch (this.transition) {28            case GDGotoScreenAction.GDScreenTransitionFade:29                oldScreenAnimation = "fadeOut";30                newScreenAnimation = "fadeIn";31                break;32            case GDGotoScreenAction.GDScreenTransitionFadeOut:33                oldScreenAnimation = "fadeOut";34//                newScreenAnimation = "fadeIn";35                oldOnTop = true;36                break;37            case GDGotoScreenAction.GDScreenTransitionScale: 38                newScreenAnimation = "zoomIn";39                break;40            case GDGotoScreenAction.GDScreenTransitionScaleOut: 41                oldScreenAnimation = "zoomOut";42                oldOnTop = true;43                break;44            // for Safari 12 we have to animate a margin, therefor use margin-animation45            // works in Technology Preview ... 46            case GDGotoScreenAction.GDScreenTransitionPushToLeft: 47                //newScreenAnimation = "slideInRight";48                newScreenAnimation = "marginInRight";49                oldScreenAnimation = "slideOutLeft";50                break;51            case GDGotoScreenAction.GDScreenTransitionPushToRight: 52                //newScreenAnimation = "slideInLeft";53                newScreenAnimation = "marginInLeft";54                oldScreenAnimation = "slideOutRight";55                break;56            case GDGotoScreenAction.GDScreenTransitionPushToTop: 57                //newScreenAnimation = "slideInUp";58                newScreenAnimation = "marginInUp";59                oldScreenAnimation = "slideOutUp";60                break;61            case GDGotoScreenAction.GDScreenTransitionPushToBottom: 62                //newScreenAnimation = "slideInDown";63                newScreenAnimation = "marginInDown";64                oldScreenAnimation = "slideOutDown";65                break;66            case GDGotoScreenAction.GDScreenTransitionMoveFromLeft: 67                //newScreenAnimation = "slideInLeft";68                newScreenAnimation = "marginInLeft";69                break; 70            case GDGotoScreenAction.GDScreenTransitionMoveFromRight: 71                //newScreenAnimation = "slideInRight";72                newScreenAnimation = "marginInRight";73                break; 74            case GDGotoScreenAction.GDScreenTransitionMoveFromBottom: 75                //newScreenAnimation = "slideInUp";76                newScreenAnimation = "marginInUp";77                break; 78            case GDGotoScreenAction.GDScreenTransitionMoveFromTop: 79                //newScreenAnimation = "slideInDown";80                newScreenAnimation = "marginInDown";81                break; 82            case GDGotoScreenAction.GDScreenTransitionMoveToLeft: 83                oldScreenAnimation = "slideOutLeft";84                oldOnTop = true;85                break; 86            case GDGotoScreenAction.GDScreenTransitionMoveToRight: 87                oldScreenAnimation = "slideOutRight";88                oldOnTop = true;89                break; 90            case GDGotoScreenAction.GDScreenTransitionMoveToBottom: 91                oldScreenAnimation = "slideOutDown";92                oldOnTop = true;93                break; 94            case GDGotoScreenAction.GDScreenTransitionMoveToTop: 95                oldScreenAnimation = "slideOutUp";96                oldOnTop = true;97                break; 98            default:99                // if we have a transition which is not knowm100                oldScreenAnimation = "fadeOut";101                newScreenAnimation = "fadeIn";102        }103        return [oldScreenAnimation, newScreenAnimation, oldOnTop];104    }105    moveChildren(sourceElement, targetElement) {106        let children = [];107        for (let i=0; i<sourceElement.children.length; i++) {108            let child = sourceElement.children[i];109            children.push(child);110        }111        children.forEach( c=> targetElement.appendChild(c));112    }113    createNewScreenContainer(screenDOMElement) {114        let newScreenContainer = document.createElement("div");115        newScreenContainer.className = screenDOMElement.className + " NewScreenContainer";116        newScreenContainer.innerHTML = screenDOMElement.innerHTML;117        newScreenContainer.style.animationDuration =this.duration + "s";118        return newScreenContainer;119    }120    animateScreenTransition(screen) {121        const at = this.at;122        const oldScreen = at.currentScreen;123        // new screen goes into this container .... 124        let newScreenContainer = this.createNewScreenContainer(screen.DOMElement);125        screen.insertStyleSheets();126        let [oldScreenAnimation, newScreenAnimation, oldOnTop] = this.convertTransitionToAnimationClasses();127        if (newScreenAnimation != "") {128            newScreenContainer.classList.add(newScreenAnimation, "animated");129        }130        let oldClassNames = document.body.className;131        132        // container for the oldscreen (not all transition needs this, but so far we use it for all, 133        const oldScreenContainer = document.createElement("div");134        oldScreenContainer.style.animationDuration = `${this.duration} s`;135        oldScreenContainer.className = `${oldClassNames} NewScreenContainer ${oldScreenAnimation} animated`; 136        if (oldOnTop) {137            oldScreenContainer.style.zIndex = 1;138        }139        // #645 cleanup effects to not show them twice:140        document.querySelectorAll(".animated").forEach( e => {141            if (e.figure) {142                e.className = cssClassNameForCell(e.figure, at.project) 143            }144        });145        this.moveChildren(document.body, oldScreenContainer);146        document.body.appendChild(oldScreenContainer);147        const endAnimationListener = () => {148            // when the animation is finished we need to remove the animation-containers ... 149            newScreenContainer.remove();150            at.screenElement.parentNode.replaceChild(screen.DOMElement, at.screenElement);151            at.screenElement = screen.DOMElement;152            at.currentScreen = screen;153            at.executeFinalWidgetLayoutPass(screen);154            this.moveChildren(oldScreenContainer, oldScreen.DOMElement);155            // since we cache the body-Elements we have to remove the oldScreenContainer-Div afterwards156            oldScreenContainer.remove();157            at.dispatchEvent({type: 'loadscreen', defaultPrevented: false});158        }159        if (newScreenAnimation != "") {160            newScreenContainer.addEventListener("animationend", endAnimationListener);161        } else if (oldScreenAnimation != "") {162            oldScreenContainer.addEventListener("animationend", endAnimationListener);163        }164        document.body.appendChild(newScreenContainer);165    }166    /**167     * selects the given screen with the transition/duration given in the constructor.168     *169     * @param {GDScreen} screen170     */171    gotoScreenWithTransition(screen) {172        let at = this.at;173        at.dispatchEvent({type: 'unloadscreen', defaultPrevented: false});174        if (screen.DOMElement == undefined) {175            screen.createStyleSheets();176            screen.DOMElement = at.buildDOMForCell(screen);177        }178        this.animateScreenTransition(screen);179    }180}181/**182    screen-transition in in-place presentation mode and live preview. (internally)183*/184export class GDEditModeScreenAnimator extends GDScreenAnimator {185    gotoScreenWithID(i) {186        let at = this.at;187        at.dispatchEvent({type: 'unloadscreen', defaultPrevented: false});188        const cachedScreen = at.cachedScreenWithObjectID(i);189        if (cachedScreen) {190            this.animateScreenTransition(cachedScreen);191        } else {192            let request = new XMLHttpRequest();193            request.open("GET", "/proxy/fetchobject?document=" + at.serverDocumentName + "&entity=GDFigure&id="+i);194            request.onreadystatechange = () => {195                if (request.readyState == XMLHttpRequest.DONE && request.status === 200) {196                    const json = JSON.parse(request.response);197                    let screen = GDModelObject.fromJSONObjectInProject(json, at.project);198                    screen.createStyleSheets();199                    at._cachedScreens.set(i, screen);200                    screen.DOMElement  = at.buildDOMForCell(screen);201                    this.animateScreenTransition(screen);202                }203            }204            request.send();205        }206    }...

Full Screen

Full Screen

fs-strings.js

Source:fs-strings.js Github

copy

Full Screen

1"use strict";2/*  STRING FUNCTIONS3 ******************************************************************************/4window.FS_String = (function() {5	// PRIVATE6	// PUBLIC7	return {8		// add a leading zero9		pad: function(num, size) {10			try {11				var s = num + "";12				while (s.length < size) s = "0" + s;13				return s;14			} catch (err) {15				console.error(err);16			}17		},18		containsVowel: function(str) {19			try {20				return /[aeiouAEIOU]/.test(str);21			} catch (err) {22				console.error(err);23			}24		},25		ucFirst: function(str) {26			try {27				if (str === undefined || str === "") return str;28				return str.charAt(0).toUpperCase() + str.slice(1);29			} catch (err) {30				console.error(err);31			}32		},33		/**34		 *	Insert stylesheet into a page, ensure it works for CSS3 animations35		 *	credit: https://stackoverflow.com/a/43904152/44187836		 */37		insertStylesheets: function() {38			try {39				if ($("#tally_styles").length) return;40				let sheets = document.styleSheets,41					style = document.createElement('style'),42					addKeyFrames = null;43				style.setAttribute("id", "tally_styles");44				style.appendChild(document.createTextNode(""));45				document.head.appendChild(style);46				if (CSS && CSS.supports && CSS.supports('animation: name')) {47					// we can safely assume that the browser supports unprefixed version.48					addKeyFrames = function(name, frames) {49						let sheet = sheets[sheets.length - 1];50						sheet.insertRule(51							"@keyframes " + name + "{" + frames + "}");52					};53				}54			} catch (err) {55				console.error(err);56			}57		},58		removeHTML: function(str = "") {59			try {60				if (!str) return;61				// make sure it is a string62				if (typeof str !== "string") {63					console.warn("FS_String.removeHTML() NOT A STRING");64				}65				// remove html and resulting whitespace66				return str.replace(/<[^>]*>?/gm, ' ').replace(/\s+/g, ' ');67			} catch (err) {68				console.error(err);69			}70		},71		/**72		 *	Trim a string to length73		 */74		trimStr: function(str, length) {75			try {76				return str.length > length ? str.substring(0, length - 3) + "&hellip;" : str;77			} catch (err) {78				console.error(err);79			}80		},81		/**82		 * Clean a string of punctuation, commas, etc, return as array83		 */84		cleanStringReturnTagArray: function(str = "") {85			try {86				var arr = [];87				// decode html entitites88				str = this.htmlDecode(str);89				// console.log(str);90				// remove html91				str = FS_String.removeHTML(str);92				// console.log(str);93				// remove punctuation94				str = str.replace(/['!"#$%&\\'…,()\*+\-\.\/:;<=>?@\[\\\]\^_`{|}~']/g, " ");95				// console.log(str);96				// clean97				str = str98					.replace(/[0-9]/g, '') // remove numbers99					.replace(/\s+/g, ' ') // remove multiple (white)spaces100					.toLowerCase() // convert to lowercase101					.trim();102				// console.log(str);103				// if chars left then split into array104				if (str.length > 2) arr = str.split(" ");105				//  make sure each tag is > 2 long106				for (let i = 0; i < arr.length; i++)107					if (arr[i].length <= 2) arr.splice(i, 1);108				// console.log(JSON.stringify(arr));109				return arr;110			} catch (err) {111				console.error(err);112			}113		},114		htmlDecode: function(value) {115			try {116				return $("<div/>").html(value).text();117			} catch (err) {118				console.error(err);119			}120		},121		removeStopWords: function(str = null, wordArr = null) {122			try {123				var common = this.stopWords();124				if (wordArr === null) // allow str or arrays125					wordArr = str.match(/\w+/g);126				var commonObj = {},127					uncommonArr = [],128					word, i;129				for (i = 0; i < common.length; i++) {130					commonObj[common[i].trim()] = true;131				}132				for (i = 0; i < wordArr.length; i++) {133					word = wordArr[i].trim().toLowerCase();134					if (!commonObj[word]) {135						uncommonArr.push(word);136					}137				}138				return uncommonArr;139			} catch (err) {140				console.error(err);141			}142		},143		stopWords: function() {144			try {145				// http://geeklad.com/remove-stop-words-in-javascript146				return ['a', 'about', 'above', 'across', 'after', 'again', 'against', 'all', 'almost', 'alone', 'along', 'already', 'also',147					'although', 'always', 'among', 'an', 'and', 'another', 'any', 'anybody', 'anyone', 'anything', 'anywhere', 'are', 'area',148					'areas', 'around', 'as', 'ask', 'asked', 'asking', 'asks', 'at', 'away', 'b', 'back', 'backed', 'backing', 'backs', 'be', 'became',149					'because', 'become', 'becomes', 'been', 'before', 'began', 'behind', 'being', 'beings', 'best', 'better', 'between', 'big',150					'both', 'but', 'by', 'c', 'came', 'can', 'cannot', 'case', 'cases', 'certain', 'certainly', 'clear', 'clearly', 'come', 'could',151					'd', 'did', 'differ', 'different', 'differently', 'do', 'does', 'done', 'down', 'down', 'downed', 'downing', 'downs', 'during',152					'e', 'each', 'early', 'either', 'end', 'ended', 'ending', 'ends', 'enough', 'even', 'evenly', 'ever', 'every', 'everybody',153					'everyone', 'everything', 'everywhere', 'f', 'face', 'faces', 'fact', 'facts', 'far', 'felt', 'few', 'find', 'finds', 'first',154					'for', 'four', 'from', 'full', 'fully', 'further', 'furthered', 'furthering', 'furthers', 'g', 'gave', 'general', 'generally',155					'get', 'gets', 'give', 'given', 'gives', 'go', 'going', 'good', 'goods', 'got', 'great', 'greater', 'greatest', 'group',156					'grouped', 'grouping', 'groups', 'h', 'had', 'has', 'have', 'having', 'he', 'her', 'here', 'herself', 'high', 'high', 'high',157					'higher', 'highest', 'him', 'himself', 'his', 'how', 'however', 'i', 'if', 'important', 'in', 'interest', 'interested',158					'interesting', 'interests', 'into', 'is', 'it', 'its', 'itself', 'j', 'just', 'k', 'keep', 'keeps', 'kind', 'knew', 'know',159					'known', 'knows', 'l', 'large', 'largely', 'last', 'later', 'latest', 'least', 'less', 'let', 'lets', 'like', 'likely', 'long',160					'longer', 'longest', 'm', 'made', 'make', 'making', 'man', 'many', 'may', 'me', 'member', 'members', 'men', 'might', 'more',161					'most', 'mostly', 'mr', 'mrs', 'much', 'must', 'my', 'myself', 'n', 'necessary', 'need', 'needed', 'needing', 'needs', 'never',162					'new', 'new', 'newer', 'newest', 'next', 'no', 'nobody', 'non', 'noone', 'not', 'nothing', 'now', 'nowhere', 'number', 'numbers',163					'o', 'of', 'off', 'often', 'old', 'older', 'oldest', 'on', 'once', 'one', 'only', 'open', 'opened', 'opening', 'opens', 'or',164					'order', 'ordered', 'ordering', 'orders', 'other', 'others', 'our', 'out', 'over', 'p', 'part', 'parted', 'parting', 'parts',165					'per', 'perhaps', 'place', 'places', 'point', 'pointed', 'pointing', 'points', 'possible', 'present', 'presented',166					'presenting', 'presents', 'problem', 'problems', 'put', 'puts', 'q', 'quite', 'r', 'rather', 'really', 'right', 'right', 'room',167					'rooms', 's', 'said', 'same', 'saw', 'say', 'says', 'second', 'seconds', 'see', 'seem', 'seemed', 'seeming', 'seems', 'sees',168					'several', 'shall', 'she', 'should', 'show', 'showed', 'showing', 'shows', 'side', 'sides', 'since', 'small', 'smaller',169					'smallest', 'so', 'some', 'somebody', 'someone', 'something', 'somewhere', 'state', 'states', 'still', 'still', 'such', 'sure',170					't', 'take', 'taken', 'than', 'that', 'the', 'their', 'them', 'then', 'there', 'therefore', 'these', 'they', 'thing', 'things',171					'think', 'thinks', 'this', 'those', 'though', 'thought', 'thoughts', 'three', 'through', 'thus', 'to', 'today', 'together',172					'too', 'took', 'toward', 'turn', 'turned', 'turning', 'turns', 'two', 'u', 'under', 'until', 'up', 'upon', 'us', 'use', 'used',173					'uses', 'v', 'very', 'w', 'want', 'wanted', 'wanting', 'wants', 'was', 'way', 'ways', 'we', 'well', 'wells', 'went', 'were', 'what',174					'when', 'where', 'whether', 'which', 'while', 'who', 'whole', 'whose', 'why', 'will', 'with', 'within', 'without', 'work',175					'worked', 'working', 'works', 'would', 'x', 'y', 'year', 'years', 'yet', 'you', 'young', 'younger', 'youngest', 'your', 'yours', 'z',176					//177					"ain't", "aren't", "can't", "could've", "couldn't", "didn't", "doesn't", "don't", "hasn't", "he'd", "he'll", "he's", "how'd", "how'll", "how's", "i'd", "i'll", "i'm", "i've", "isn't", "it's", "might've", "mightn't", "must've", "mustn't", "shan't", "she'd", "she'll", "she's", "should've", "shouldn't", "that'll", "that's", "there's", "they'd", "they'll", "they're", "they've", "wasn't", "we'd", "we'll", "we're", "weren't", "what'd", "what's", "when'd", "when'll", "when's", "where'd", "where'll", "where's", "who'd", "who'll", "who's", "why'd", "why'll", "why's", "won't", "would've", "wouldn't", "you'd", "you'll", "you're", "you've",178					// mine179					"ages", "generations", "carefully", "page", "directly", "description", "test", "title", "keywords"180				];181			} catch (err) {182				console.error(err);183			}184		},185		// remove small words186		// count down so no skipping occurs187		 removeSmallWords: function(arr) {188			try {189				for (var i = arr.length - 1; i >= 0; i--) {190					if (arr[i].length < 3)191						arr.splice(i, 1);192				}193				return arr;194			} catch (err) {195				console.error(err);196			}197		}198	};...

Full Screen

Full Screen

app.js

Source:app.js Github

copy

Full Screen

1let iframeTest = document.querySelector("iframe");2let highlightOver = document.createElement("div");3highlightOver.id = "highlight-over";4let selectionDiv = document.createElement("div");5selectionDiv.className = "highlight-selection";6selectionDiv.tabIndex = "1";7let paddingDiv = document.createElement("div");8paddingDiv.className = "highlight-element__padding";9let marginDiv = document.createElement("div");10marginDiv.className = "highlight-element__margin";11let borderDiv = document.createElement("div");12borderDiv.className = "highlight-element__border";13document.body.append(highlightOver, selectionDiv, paddingDiv, marginDiv, borderDiv);14let drawSelection;//requestAnimationFrame reference15window.tilepieces = {16  version : "0.1.13",17  projects: [],18  globalComponents: [],19  localComponents: [],20  isComponent: false,21  currentProject: null,22  fileSelected: {},23  applicationName: "tilepieces",24  componentPath: "components",25  componentAttribute: "data-tilepieces-component",26  currentStyleSheetAttribute: "data-tilepieces-current-stylesheet",27  currentPage: {},28  core: null,29  panels: [],30  lastEditable: null,31  multiselections: [],32  editMode: "",33  name: "tilepieces",34  editElements: {35    highlight: highlightOver,36    selection: selectionDiv,37    paddingDiv,38    marginDiv,39    borderDiv,40    padding: null,41    border: null,42    margin: null43  },44  relativePaths: false,45  imageDir: "images",46  miscDir: "miscellaneous",47  frame: iframeTest,48  panelPosition: "free",49  idGenerator: "app-",50  classGenerator: "app-",51  getFilesAsDataUrl: true,52  insertionMode: 'append',53  storageInterface: window.storageInterface,54  delayUpdateFileMs: 500,55  sandboxFrame: true,56  waitForStyleSheetLoadMs: 10000,57  imageTypeProcess: window.storageInterface ? 0 : 64, // 64 : base6458  insertStyleSheets: "stylesheet",// stylesheet,inline,inline!important59  menuFileList: [],60  htmlDefaultPath: "html",61  jsDefaultPath: "js",62  cssDefaultPath: "css",63  workspace: "www",64  terserConfiguration: {compress: false, mangle: false},65  frameResourcePath: () => tilepieces.workspace ? (tilepieces.workspace + "/" + (tilepieces.currentProject || "")).replace(/\/+/g, "/") : "",66  serviceWorkers: [],67  skipMatchAll : false,68  utils: {69    numberRegex: /[+-]?\d+(?:\.\d+)?|[+-]?\.\d+?/,70    colorRegex: /rgb\([^)]*\)|rgba\([^)]*\)|#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})\b|hsl\([^)]*\)|hsla\([^)]*\)/g,71    valueRegex: /([+-]?\d+(?:\.\d+)?|[+-]?\.\d+?)(em|ex|ch|rem|vh|vw|vmin|vmax|cm|mm|in|px|pt|pc|fr)/g,72    // Phrasing content ( https://html.spec.whatwg.org/#phrasing-content )73    // Heading content ( https://html.spec.whatwg.org/#heading-content )74    // Embedded content75    // interactive content minus a76    // https://stackoverflow.com/questions/9852312/list-of-html5-elements-that-can-be-nested-inside-p-element77    // minus A,78    tagWhereCannotInsertOthers: /^(P|H1|H2|H3|H4|H5|H6|ABBR|AUDIO|B|BDI|BDO|BR|BUTTON|CANVAS|CITE|CODE|DATA|DATALIST|DEL|DFN|EM|EMBED|I|IFRAME|IMG|INPUT|INS|HR|KBD|LABEL|MAP|MARK|METER|NOSCRIPT|OBJECT|OUTPUT|PICTURE|PROGRESS|Q|RUBY|SAMP|SCRIPT|SELECT|SLOT|SMALL|SPAN|STRONG|SUB|SUP|SVG|TEMPLATE|TEXTAREA|TIME|U|UL|OL|DL|VAR|VIDEO|WBR)$/,79    // https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories80    flowTags: /^(A|ABBR|ADDRESS|ARTICLE|ASIDE|AUDIO|B|BDO|BDI|BLOCKQUOTE|BR|BUTTON|CANVAS|CITE|CODE|COMMAND|DATA|DATALIST|DEL|DETAILS|DFN|DIV|DL|EM|EMBED|FIELDSET|FIGURE|FOOTER|FORM|H1|H2|H3|H4|H5|H6|HEADER|HGROUP|HR|I|IFRAME|IMG|INPUT|INS|KBD|KEYGEN|LABEL|MAIN|MAP|MARK|MATH|MENU|METER|NAV|NOSCRIPT|OBJECT|OL|OUTPUT|P|PICTURE|PRE|PROGRESS|Q|RUBY|S|SAMP|SCRIPT|SECTION|SELECT|SMALL|SPAN|STRONG|SUB|SUP|SVG|TABLE|TEMPLATE|TEXTAREA|TIME|UL|VAR|VIDEO|WBR)$/,81    phrasingTags: /^(A|ABBR|AUDIO|B|BDI|BDO|BR|BUTTON|CANVAS|CITE|CODE|DATA|DATALIST|DEL|DFN|EM|EMBED|I|IFRAME|IMG|INPUT|INS|KBD|LABEL|MAP|MARK|METER|NOSCRIPT|OBJECT|OUTPUT|PICTURE|PROGRESS|Q|RUBY|SAMP|SCRIPT|SELECT|S|SLOT|SMALL|SPAN|STRONG|SUB|SUP|SVG|TEMPLATE|TEXTAREA|TIME|U|VAR|VIDEO|WBR)$/,82    notInsertableTags: /^(UL|OL|DL|TABLE|COL|COLGROUP|TBODY|THEAD|TFOOT|TR)$/,83    embeddedContentTags: /AUDIO|CANVAS|EMBED|IFRAME|IMG|MATH|NOSCRIPT|PICTURE|SVG|VIDEO/,84    notEditableTags: /^(AREA|AUDIO|BR|CANVAS|DATALIST|EMBED|HEAD|HR|IFRAME|IMG|INPUT|LINK|MAP|METER|META|OBJECT|OUTPUT|MATH|PROGRESS|PICTURE|SELECT|SCRIPT|SOURCE|SVG|STYLE|TEXTAREA|TITLE|VIDEO)$/,85    textPermittedPhrasingTags: /^(A|ABBR|B|BDI|BDO|BR|CITE|CODE|DATA|DEL|DFN|EM|I|INS|KBD|MARK|OUTPUT|Q|RUBY|SAMP|S|SMALL|SPAN|STRONG|SUB|SUP|TIME|U|VAR|WBR)$/,86    textPermittedFlowTags: /^(UL|OL|H1|H2|H3|H4|H5|H6|P)$/,87    restrictedFlowInsideTags: /^(H1|H2|H3|H4|H5|H6|P)$/,88    // https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types#textjavascript89    javascriptMimeTypes: ["", "module", "application/javascript", "application/ecmascript", "application/x-ecmascript ", "application/x-javascript ", "text/javascript", "text/ecmascript", "text/javascript1.0 ", "text/javascript1.1 ", "text/javascript1.2 ", "text/javascript1.3 ", "text/javascript1.4 ", "text/javascript1.5 ", "text/jscript ", "text/livescript ", "text/x-ecmascript ", "text/x-javascript"],90    // https://stackoverflow.com/a/1970984691    URLIsAbsolute: /^(?:[a-z]+:)?\/\//i,92    // https://stackoverflow.com/questions/49974145/how-to-convert-rgba-to-hex-color-code-using-javascript#:~:text=Since%20the%20alpha%20channel%20in,%2Fg%2C%20'').93    // https://css-tricks.com/converting-color-spaces-in-javascript/94    // functions:95    getResourceAbsolutePath : (path)=>{96      return ("/" + tilepieces.frameResourcePath() + "/" + path).replace(/\/\//g,"/")97    },98    elementSum,99    processFile,100    getDimension,101    splitCssValue,102    convertGroupingRuleToSelector,103    notAdmittedTagNameInPosition,104    download,105    createDocumentString,106    unregisterSw,107    paddingURL,108    getRelativePath,109    getDocumentPath,110    getHashes,111    setFixedHTMLInProject,112    dialogNameResolver113  }...

Full Screen

Full Screen

stylesheets.js

Source:stylesheets.js Github

copy

Full Screen

1var debug = require('debug')('magicbook:stylesheets');2var _ = require("lodash");3var vfs = require("vinyl-fs");4var gutil = require("gulp-util");5var through = require("through2");6var fileHelpers = require("../helpers/file");7var streamHelpers = require("../helpers/stream");8var path = require("path");9var sass = require("node-sass");10var CleanCSS = require("clean-css");11var concat = require("gulp-concat");12// through2 function to remove whitespace from CSS files13// Returns: Vinyl filestream14function compress() {15  return through.obj(function(file, enc, cb) {16    new CleanCSS().minify(file.contents, function(err, minified) {17      file.contents = Buffer.from(minified.styles);18      cb(err, file);19    });20  });21}22// through2 function to convert a scss file to css23// Returns: Vinyl filestream24function scss(config) {25  return through.obj(function(file, enc, cb) {26    if (fileHelpers.isScss(file)) {27      sass.render(28        {29          file: file.path,30          functions: {31            "font-path($filename: 0)": function(filename) {32              var f = filename.getValue();33              var fontsFolder = config.fonts.destination;34              var cssFile = path.join(35                config.stylesheets.destination,36                file.relative37              );38              var relativeFolders = path.relative(39                path.dirname(cssFile),40                fontsFolder41              );42              return new sass.types.String(43                "url('" + path.join(relativeFolders, f) + "')"44              );45            }46          }47        },48        function(err, result) {49          if (err) console.log("Error parsing SCSS", err);50          file.contents = result.css;51          file.path = gutil.replaceExtension(file.path, ".css");52          debug('Finished');53          cb(err, file);54        }55      );56    } else {57      debug('Skipped');58      cb(null, file);59    }60  });61}62var Plugin = function(registry) {63  registry.before(64    "load",65    "stylesheets:move",66    _.bind(this.moveStylesheets, this)67  );68  registry.before(69    "liquid",70    "stylesheets:insert",71    _.bind(this.insertStylesheets, this)72  );73};74Plugin.prototype = {75  moveStylesheets: function(config, extras, callback) {76    var that = this;77    that.allFiles = [];78    // get the stylesheets needed for this format79    var stylesheets = _.get(config, "stylesheets.files");80    // if the array exists81    if (stylesheets) {82      var cssFolder = config.stylesheets.destination;83      var cssFolderAbsolute = path.join(extras.destination, cssFolder);84      // gather the files85      var cssStream = vfs.src(stylesheets).pipe(scss(config));86      // bundle87      var bundle = _.get(config, "stylesheets.bundle");88      if (bundle) {89        var filename = _.isString(bundle) ? bundle : "bundle.css";90        cssStream = cssStream.pipe(concat(filename));91      }92      // compress93      if (_.get(config, "stylesheets.compress")) {94        cssStream = cssStream.pipe(compress());95      }96      // digest97      if (_.get(config, "stylesheets.digest")) {98        cssStream = cssStream.pipe(streamHelpers.digest());99      }100      // put all the filenames in the stylesheets array101      cssStream = cssStream.pipe(102        through.obj(function(file, enc, cb) {103          // save the path to the css file from within the build folder104          that.allFiles.push(path.join(cssFolder, file.relative));105          cb(null, file);106        })107      );108      // finish109      cssStream.pipe(vfs.dest(cssFolderAbsolute)).on("finish", function() {110        callback(null, config, extras);111      });112    } else {113      callback(null, config, extras);114    }115  },116  insertStylesheets: function(config, stream, extras, callback) {117    var allFiles = this.allFiles;118    // add the locals to the files liquidLocals119    stream = stream.pipe(120      through.obj(function(file, enc, cb) {121        var styles = "";122        _.each(allFiles, function(js) {123          var href = path.relative(path.dirname(file.relative), js);124          styles += '<link rel="stylesheet" href="' + href + '">\n';125        });126        _.set(file, "layoutLocals.stylesheets", styles);127        cb(null, file);128      })129    );130    callback(null, config, stream, extras);131  }132};...

Full Screen

Full Screen

setCss.js

Source:setCss.js Github

copy

Full Screen

1TilepiecesCore.prototype.setCss = function (el, name, value, selectorText) {2  var $self = this;3  var currentStylesheet = $self.currentStyleSheet;4  var insertType = tilepieces.insertStyleSheets;5  selectorText = selectorText || tilepieces.cssSelector;6  if (insertType == "stylesheet") {7    /*8    if (el.style.item(name) && $self.htmlMatch.match(el))9      $self.htmlMatch.style(el, name, "");*/10    if (currentStylesheet) {11      // if currentMediaRule exists anymore12      if (tilepieces.core.currentMediaRule &&13        (!tilepieces.core.currentMediaRule.parentStyleSheet ||14          !tilepieces.core.currentMediaRule.parentStyleSheet.ownerNode ||15          !tilepieces.core.currentDocument.documentElement.contains(tilepieces.core.currentMediaRule.parentStyleSheet.ownerNode)16        ))17        tilepieces.core.currentMediaRule = null;18      if (tilepieces.core.currentMediaRule &&19        $self.currentWindow.matchMedia(tilepieces.core.currentMediaRule.conditionText).matches)20        currentStylesheet = tilepieces.core.currentMediaRule;21      var currentRules = [...currentStylesheet.cssRules];22      var decFound = currentRules.find(cssRule => cssRule.selectorText == selectorText);23      if (decFound) {24        $self.setCssProperty(decFound, name, value);25        return decFound.style.getPropertyValue(name);26      } else {27        var index = currentStylesheet.cssRules.length;28        $self.insertCssRule(currentStylesheet, selectorText + `{${name}:${value}}`, index);29        return currentStylesheet.cssRules[index].style.getPropertyValue(name);30      }31    } else {32      $self.createCurrentStyleSheet("");33      $self.insertCssRule($self.currentStyleSheet, selectorText + `{${name}:${value}}`);34      return $self.currentStyleSheet.cssRules[0].style.getPropertyValue(name);35    }36  } else {37    $self.htmlMatch.style(el, name, value, insertType == "inline!important" ? "important" : "");38    return el.style.getPropertyValue(name);39  }...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1describe('My First Test', () => {2  it('Visits the Kitchen Sink', () => {3  })4})5Cypress.Commands.add('insertStylesheets', (url) => {6  cy.document().then((doc) => {7    const link = doc.createElement('link')8    link.setAttribute('rel', 'stylesheet')9    link.setAttribute('href', url)10    doc.head.appendChild(link)11  })12})13declare namespace Cypress {14  interface Chainable {15    insertStylesheets(url: string): void16  }17}

Full Screen

Using AI Code Generation

copy

Full Screen

1describe('My First Test', function() {2  it('Visits the Kitchen Sink', function() {3    cy.get('.container').should('have.css', 'background-color', 'rgb(255, 255, 255)')4  })5})6describe('My First Test', function() {7  it('Visits the Kitchen Sink', function() {8    cy.get('.container').should('have.css', 'background-color', 'rgb(255, 255, 255)')9  })10})11describe('My First Test', function() {12  it('Visits the Kitchen Sink', function() {13    cy.wait(1000)14    cy.get('.container').should('have.css', 'background-color', 'rgb(255, 255, 255)')15  })16})

Full Screen

Using AI Code Generation

copy

Full Screen

1import 'cypress-file-upload';2describe('My First Test', function() {3  it('Does not do much!', function() {4    cy.get('input[type=file]').attachFile('test.xlsx')5  })6})

Full Screen

Using AI Code Generation

copy

Full Screen

1describe('Test', () => {2  it('test', () => {3    cy.get('div').contains('My App')4  })5})6Cypress.Commands.add('insertStylesheets', (styleSheets) => {7  styleSheets.forEach(styleSheet => {8    cy.document().then(doc => {9      const link = doc.createElement('link')10      link.setAttribute('rel', 'stylesheet')11      link.setAttribute('href', styleSheet)12      doc.head.appendChild(link)13    })14  })15})

Full Screen

Using AI Code Generation

copy

Full Screen

1import 'cypress-file-upload';2describe('My First Test', function() {3    it('Does not do much!', function() {4        cy.insertStylesheets(['./cypress/fixtures/stylesheet.css'])5        cy.get('#hplogo').should('be.visible')6    })7})8#hplogo {9}10import 'cypress-file-upload';11describe('My First Test', function() {12    it('Does not do much!', function() {13        cy.get('#hplogo').should('be.visible')14    })15})16#hplogo {17}18import 'cypress-file-upload';19describe('My First Test', function() {20    it('Does not do much!', function() {21        cy.get('#hplogo').should('be.visible')22    })23})24#hplogo {25}26import 'cypress-file-upload';27describe('My First Test', function() {28    it('Does not do much!', function() {

Full Screen

Using AI Code Generation

copy

Full Screen

1import { insertStylesheets } from 'cypress-visual-regression/dist/plugin';2insertStylesheets([3]);4describe('My First Test', () => {5  it('Visits the app root url', () => {6    cy.visit('/')7    cy.takeSnapshot('Home page')8  })9})10const { insertStylesheets } = require('cypress-visual-regression/dist/plugin');11module.exports = (on, config) => {12  insertStylesheets([13  ]);14}15const { takeSnapshot } = require('cypress-visual-regression/dist/command');16Cypress.Commands.add('takeSnapshot', takeSnapshot);17import './commands'18import { insertStylesheets } from 'cypress-visual-regression/dist/plugin';19insertStylesheets([

Full Screen

Using AI Code Generation

copy

Full Screen

1import { mount } from "@cypress/react";2import React from "react";3import { MyComponent } from "../src/MyComponent";4describe("MyComponent", () => {5  it("renders", () => {6    ];7    cy.insertStylesheets(stylesheets);8    mount(<MyComponent />);9  });10});

Full Screen

Cypress Tutorial

Cypress is a renowned Javascript-based open-source, easy-to-use end-to-end testing framework primarily used for testing web applications. Cypress is a relatively new player in the automation testing space and has been gaining much traction lately, as evidenced by the number of Forks (2.7K) and Stars (42.1K) for the project. LambdaTest’s Cypress Tutorial covers step-by-step guides that will help you learn from the basics till you run automation tests on LambdaTest.

Chapters:

  1. What is Cypress? -
  2. Why Cypress? - Learn why Cypress might be a good choice for testing your web applications.
  3. Features of Cypress Testing - Learn about features that make Cypress a powerful and flexible tool for testing web applications.
  4. Cypress Drawbacks - Although Cypress has many strengths, it has a few limitations that you should be aware of.
  5. Cypress Architecture - Learn more about Cypress architecture and how it is designed to be run directly in the browser, i.e., it does not have any additional servers.
  6. Browsers Supported by Cypress - Cypress is built on top of the Electron browser, supporting all modern web browsers. Learn browsers that support Cypress.
  7. Selenium vs Cypress: A Detailed Comparison - Compare and explore some key differences in terms of their design and features.
  8. Cypress Learning: Best Practices - Take a deep dive into some of the best practices you should use to avoid anti-patterns in your automation tests.
  9. How To Run Cypress Tests on LambdaTest? - Set up a LambdaTest account, and now you are all set to learn how to run Cypress tests.

Certification

You can elevate your expertise with end-to-end testing using the Cypress automation framework and stay one step ahead in your career by earning a Cypress certification. Check out our Cypress 101 Certification.

YouTube

Watch this 3 hours of complete tutorial to learn the basics of Cypress and various Cypress commands with the Cypress testing at LambdaTest.

Run Cypress automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful