Skip to content

Math involving return value of function does not simplify result #504

@TimWolla

Description

@TimWolla

This is an issue encountered while working with Font Awesome 6 Beta 2. The Font Awesome files can be found here: https://fontawesome.com/download

Font Awesome includes a custom divide implementation in _functions.scss. This implementation is then used to derive font sizes like this:

font-size: (divide($font-size, $fa-size-scale-base)) * 1em;

In scssphp this results in font-size: 1.5 * 1em; with the literal asterisk. In the dart-sass playground at https://www.sassmeister.com/ this will result in font-size: 1.5em.

If I remove the function call and replace it by a /, it works properly in both.


Simple reproducer:

@function divide($dividend, $divisor, $precision: 10) {
  @return $dividend / $divisor;
}

$fa-size-scale-base     : 16 !default;

.fa-xl {
    font-size: (divide(24, $fa-size-scale-base)) * 1em;
    font-size: ((24 / $fa-size-scale-base)) * 1em;
}

In the playground this will return:

.fa-xl {
  font-size: 1.5em;
  font-size: 1.5em;
}

In scssphp this will return:

.fa-xl {
  font-size: 1.5 * 1em;
  font-size: 1.5em;
}

I am using:

$ vendor/bin/pscss --version
1.8.1

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workingspec complianceIssues with compliance to the Sass spec

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions