Giter VIP home page Giter VIP logo

Comments (6)

pablosichert avatar pablosichert commented on June 28, 2024 2

Oh, that looks bad indeed - yes, they pass on my machine (Ubuntu).

I suspect it could be due to different default system fonts, as I don't tell in the tests which one to use.

Could you share your

  • OS
  • node version
  • npm version

to test my assumption?


And, thank you for the contribution!

from react-truncate.

capaj avatar capaj commented on June 28, 2024

@eric-adstage they pass on my ubuntu as well-after I installed couple of OS dependencies:sudo apt-get install libcairo2-dev libjpeg8-dev libpango1.0-dev libgif-dev build-essential g++

capaj@capaj-i7-4771:~/git_projects/react-truncate$ nt

> [email protected] test /home/capaj/git_projects/react-truncate
> mocha --compilers js:babel-core/register --require babel-polyfill



  <Truncate />
    ✓ should be a React component
    ✓ should render a span
    in a server environment
      ✓ should render initial static markup
    in a client environment
      ✓ should render without an error when the last line is exactly as wide as the container (138ms)
      ✓ should recalculate when resizing the window
      ✓ should clean up all event listeners on window when unmounting
      with a box of 85px mocked out
        ✓ should truncate text (78ms)
        ✓ should preserve newlines (74ms)
        ✓ should not add empty lines when text doesn't fill all lines (73ms)
        ✓ should not truncate at all if specified in lines prop (72ms)
        ✓ should end truncating when a single word is bigger than its line (72ms)
        ✓ should be able to use a react component as ellipsis (75ms)
        ✓ should update content when new children are passed in (74ms)
        onTruncate
          ✓ should invoke asynchronously (98ms)
          with Truncate.prototype.onTruncate mocked out
            ✓ should call with true when text was truncated (74ms)
            should call with false when text was not truncated because
              ✓ was disabled with lines prop (72ms)
              ✓ has shorter text than lines allow (78ms)
      innerText
        browser implements \n for <br/>
          ✓ should have newlines only at <br/>
        browser implements "" for <br/>
          ✓ should have newlines only at <br/>
    ellipsisWidth
      ✓ should equal node.offsetWidth


  20 passing (1s)

from react-truncate.

pablosichert avatar pablosichert commented on June 28, 2024

@eric-adstage, could you check out branch fix/tests-font locally to see if it passes on your machine?

Commit d7dcdae I landed on it might fix it.

from react-truncate.

eric-adstage avatar eric-adstage commented on June 28, 2024

Hey @pablosichert,

OS: OSX, 10.12.3 (16D32)
node: 5.6.0
npm: 3.6.0

I suspect you're onto something with the font issue, but unfortunately the build still fails with your latest branch, albeit 2 fewer spec failures. These, failing in my initial testing, now pass:

✓ should render without an error when the last line is exactly as wide as the container (2029ms)
✓ should be able to use a react component as ellipsis

I thought that perhaps the <div> in the "mocked out 85px box" tests needed its font specified as well, but in my initial tests, nothing changed when I specified the same 12px Times New Roman font as the canvas element uses.

from react-truncate.

eric-adstage avatar eric-adstage commented on June 28, 2024

Just as a teaser, here's a div with both padding and letter-spacing:
image

from react-truncate.

pablosichert avatar pablosichert commented on June 28, 2024

Looks good!

I'll try to get an actual OSX machine to better reason about what's going on with the test suite.

from react-truncate.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.