conatiner_queries_spec.ts

/**
 * @license
 * Copyright Google LLC All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.io/license
 */

import {ShadowCss} from '@angular/compiler/src/shadow_css';

describe('ShadowCss, container queries', () => {
  function s(css: string, contentAttr: string, hostAttr: string = '') {
    const shadowCss = new ShadowCss();
    return shadowCss.shimCssText(css, contentAttr, hostAttr);
  }

  it('should scope normal selectors inside an unnamed container rules', () => {
    const css = `
          @container max(max-width: 500px) {
            .item {
              color: red;
            }
          }
          `;
    const result = s(css, 'host-a');
    expect(result).toContain('.item[host-a] {');
  });

  it('should scope normal selectors inside a named container rules', () => {
    const css = `
          @container container max(max-width: 500px) {
            .item {
              color: red;
            }
          }
          `;
    const result = s(css, 'host-a');
    expect(result).toContain('.item[host-a] {');
  });
});