search

Lattice-Automation / seqviz

a JavaScript DNA, RNA, and protein sequence viewer
https://tools.latticeautomation.com/seqviz
MIT License
247 stars 53 forks source link

Seqviz on SSR #192

Closed isaacguerreir closed 1 year ago

isaacguerreir commented 1 year ago

I tried to use Seqviz on a Next.js project and some problems emerged.

  1. seqparse is built using self instead of this. An error almost like self is not definedappears while building nextjs project. Right now changed manually. Do you have a suggestion on how to solve this? Maybe change webpack configurations to build seqparseusing this.
  2. css-loader try to access document API to manipulate elements and classes and received some errors during build like document is not defined. Changed to isomorphic-css-loader.
  3. react-resize-detector first pass height and width as undefined (probably because when ssr the page document doesn't exist so far), and after rendering Seqviz first nodes it pass the width, but it seems to not recognize height at initialization even if you pass to <Seqviz /> a style with height:100vh and width: 100wv. I solved by inherint height and width on the SeqvizContainer component.

It still have some problems with styles. Could you help me with that? (checking what unexpected styles or behavior emerge from those changes).

jjti commented 1 year ago

Looks like it would address: https://github.com/Lattice-Automation/seqviz/issues/171

I'll check out the styling. My thought had been to move to a CSS-in-JS type library to mitigate, but if this works I'm sold

jjti commented 1 year ago

@isaacguerreir I'm gonna address in an adjacent PR I'm merging in a sec: https://github.com/Lattice-Automation/seqviz/pull/198

isaacguerreir commented 1 year ago

Nice, @jjtimmons. I was thinking about this problem lately, let me know if you need any help.

jjti commented 1 year ago

@isaacguerreir I started a thread over in the other PR about the diffs (https://github.com/Lattice-Automation/seqviz/pull/198#issuecomment-1537657929) but I want to call out that to my knowledge I only addressed points 1 and 2 that you brought up. I don't think anything I did would fix 3. Lmk if that's still an issue going forward