当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript TestEnvironment.compile方法代码示例

本文整理汇总了TypeScript中glimmer-test-helpers.TestEnvironment.compile方法的典型用法代码示例。如果您正苦于以下问题:TypeScript TestEnvironment.compile方法的具体用法?TypeScript TestEnvironment.compile怎么用?TypeScript TestEnvironment.compile使用的例子?那么, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在glimmer-test-helpers.TestEnvironment的用法示例。


在下文中一共展示了TestEnvironment.compile方法的4个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: compile

function compile(template: string) {
  return env.compile(template);
}
开发者ID:Joelkang,项目名称:glimmer,代码行数:3,代码来源:initial-render-test.ts

示例2: renderContent

function renderContent() {
  let data = JSON.parse($data.value);

  let env = new TestEnvironment();

  env.registerEmberishGlimmerComponent("h-card", null, $layout.value);

  let app = env.compile($template.value);

  function compileLayout(component) {
    let definition = env.getComponentDefinition([component]);
    let compiled = layoutFor(definition, env);
    let children = definition['compileLayout'](env).children;

    // Fake a Block
    return { compiled, children, compile() {} };
  }

  function compileInner(block) {
    block.compile(env);
    block.children.forEach(compileInner);
  }

  function processOpcodes(block) {
    compileInner(block);

    return {
      opcodes: block.compiled.ops.toArray().map(op => op.toJSON()),
      children: block.children.map(processOpcodes)
    };
  }

  function processUpdatingOpcodes(list) {
    return res['updating'].toArray().map(op => op.toJSON());
  }

  let div = document.createElement('div');

  env.begin();
  let self = new UpdatableReference(data);
  let res = app.render(self, env, { appendTo: div, dynamicScope: new TestDynamicScope(null) });
  env.commit();

  ui.rendered = true;

  ui.template.source = $template.value;
  ui.template.wireFormat = JSON.parse(compileSpec($template.value, {}));
  ui.template.opcodes = processOpcodes(app.raw);

  ui.layout.source = $layout.value;
  ui.layout.wireFormat = JSON.parse(compileSpec($layout.value, {}));
  ui.layout.opcodes = processOpcodes(compileLayout("h-card"));

  ui.updatingOpcodes = processUpdatingOpcodes(res['updating']);

  ui.html = div.innerHTML;

  window['$UI'] = ui;
  window['$DIV'] = div;

  _updateContent = () => {
    self.update(JSON.parse($data.value));
    res.rerender();
    ui.updatingOpcodes = processUpdatingOpcodes(res['updating']);
    ui.html = div.innerHTML;
    rerenderUI();
  };

  rerenderUI();
}
开发者ID:GCheung55,项目名称:glimmer,代码行数:70,代码来源:visualizer.ts

示例3: renderUI


//.........这里部分代码省略.........
        <li><span class="pre">{{json local}}</span></li>
      {{/each}}
    </ol>
    <hr />
  {{/if}}
  {{#if @spec.named}}
    <h3>Named</h3>
    <ol>
      {{#each @spec.named key="@index" as |name|}}
        <li><span class="pre">{{json name}}</span></li>
      {{/each}}
    </ol>
    <hr />
  {{/if}}
  {{#if @spec.yields}}
    <h3>Yields</h3>
    <ol>
      {{#each @spec.yields key="@index" as |yield|}}
        <li><span class="pre">{{json yield}}</span></li>
      {{/each}}
    </ol>
    <hr />
  {{/if}}
  {{#if @spec.blocks}}
    <h3>Blocks</h3>
    <ol>
      {{#each @spec.blocks key="@index" as |block|}}
        <li>
          <h3>Block</h3>
          {{wire-format-inspector spec=block}}
        </li>
      {{/each}}
    </ol>
  {{/if}}
</div>`);

  env.registerHelper("pp-opcode", ([opcode]) => {
    let output = opcode.type.toUpperCase();

    if (opcode.args || opcode.details) {
      output += "(";

      if (opcode.args && opcode.args.length) {
        output += opcode.args.join(", ");
      }

      if (opcode.details) {
        let keys = Object.keys(opcode.details);

        if (keys.length) {
          if (opcode.args && opcode.args.length) {
            output += ", ";
          }

          output += keys.map(key => `${key}=${opcode.details[key]}`).join(", ");;
        }
      }

      output += ")";
    }

    return output;
  });

  env.registerEmberishGlimmerComponent("opcode-inspector", null,
`<li>
  <span class="pre">{{pp-opcode @opcode}}</span>
  {{#if @opcode.children}}
    <ol>
      {{#each @opcode.children key="guid" as |opcode|}}
        {{opcode-inspector opcode=opcode}}
      {{/each}}
    </ol>
  {{/if}}
</li>`);

  env.registerEmberishGlimmerComponent("block-inspector", null,
`<div>
  <h3>Opcodes</h3>
  <ol>
    {{#each @block.opcodes key="guid" as |opcode|}}
      <opcode-inspector opcode={{opcode}} />
    {{/each}}
  </ol>
  <hr />
  {{#each @block.children key="@index" as |inner|}}
    <div class="indent">{{block-inspector block=inner}}</div>
  {{/each}}
</div>`);

  env.begin();
  let self = new UpdatableReference(ui);
  let res = env.compile(UI).render(self, env, { appendTo: document.body, dynamicScope: new TestDynamicScope(null) });
  env.commit();

  rerenderUI = () => {
    self.update(ui);
    res.rerender();
  };
}
开发者ID:GCheung55,项目名称:glimmer,代码行数:101,代码来源:visualizer.ts

示例4: Error

 assert.throws(() => {
   env.compile('<div><p>{{./value}}</p></div>');
 }, new Error("Using \"./\" is not supported in Glimmer and unnecessary: \"./value\" on line 1."), "should throw error");
开发者ID:GCheung55,项目名称:glimmer,代码行数:3,代码来源:compile-errors-test.ts


注:本文中的glimmer-test-helpers.TestEnvironment.compile方法示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。