Skip to content

[gatsby-image] Support image loading with JavaScript disabled#3122

Merged
KyleAMathews merged 4 commits intogatsbyjs:masterfrom
kripod:gatsby-image/support-disabled-javascript
Dec 13, 2017
Merged

[gatsby-image] Support image loading with JavaScript disabled#3122
KyleAMathews merged 4 commits intogatsbyjs:masterfrom
kripod:gatsby-image/support-disabled-javascript

Conversation

@kripod
Copy link
Copy Markdown
Contributor

@kripod kripod commented Dec 3, 2017

Resolves #3109.

@gatsbybot
Copy link
Copy Markdown
Collaborator

gatsbybot commented Dec 3, 2017 •
edited
Loading

Deploy preview ready!

Built with commit 896c187

https://deploy-preview-3122--gatsbygram.netlify.com

@gatsbybot
Copy link
Copy Markdown
Collaborator

gatsbybot commented Dec 3, 2017 •
edited
Loading

Deploy preview ready!

Built with commit 2fb97a0

https://deploy-preview-3122--using-drupal.netlify.com

@fk fk mentioned this pull request Dec 3, 2017
Closed
@ghost ghost assigned KyleAMathews Dec 12, 2017
@ghost ghost added the review label Dec 12, 2017
@KyleAMathews
Copy link
Copy Markdown
Contributor

KyleAMathews commented Dec 13, 2017

Thanks! Sorry for the long delay on getting this out there — been super busy 😅

@KyleAMathews KyleAMathews merged commit b2a0810 into gatsbyjs:master Dec 13, 2017
@ghost ghost removed the review label Dec 13, 2017
@kripod kripod deleted the gatsby-image/support-disabled-javascript branch December 13, 2017 03:59
@kripod
Copy link
Copy Markdown
Contributor Author

kripod commented Dec 13, 2017

@KyleAMathews You needn’t be sorry, I can totally understand your situation of being extremely busy. I’m glad that this has finally been merged, I highly appreciate your efforts and attitude towards this project! 😊

@kripod
Copy link
Copy Markdown
Contributor Author

kripod commented Dec 14, 2017

@KyleAMathews I don't know why, but this seems to break production builds (gatsby build). I get blurry images all over the place along with the following stack trace on my web browser's console:

Uncaught Error: Minified React error #32; visit http://facebook.github.io/react/docs/error-decoder.html?invariant=32&args[]=76 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at n (reactProdInvariant.js:29)
    at u (ReactDOMComponentTree.js:101)
    at l (ReactDOMComponentTree.js:177)
    at v.f (ReactDOMComponent.js:259)
    at e.notifyAll (CallbackQueue.js:74)
    at r.close (ReactReconcileTransaction.js:78)
    at r.closeAll (Transaction.js:207)
    at r.perform (Transaction.js:154)
    at u (ReactMount.js:124)
    at r.perform (Transaction.js:141)

Development builds are fine (gatsby develop).

@KyleAMathews
Copy link
Copy Markdown
Contributor

KyleAMathews commented Dec 14, 2017

Can you try to duplicate this with the using-gatsby-image example site?

@kripod
Copy link
Copy Markdown
Contributor Author

kripod commented Dec 14, 2017 •
edited
Loading

@KyleAMathews Just visit https://using-gatsby-image.gatsbyjs.org using Chrome v63. It's pretty ironic that gatsby-image now works without JavaScript, but doesn't work with JS enabled.

@KyleAMathews
Copy link
Copy Markdown
Contributor

KyleAMathews commented Dec 14, 2017

Huh... weird this didn't show up in your and my testing.

@KyleAMathews
Copy link
Copy Markdown
Contributor

KyleAMathews commented Dec 14, 2017

This is the issue we're running into facebook/react#1252

@KyleAMathews
Copy link
Copy Markdown
Contributor

KyleAMathews commented Dec 14, 2017

looks like we still have to use dangerouslySetInnerHTML

@KyleAMathews
Copy link
Copy Markdown
Contributor

KyleAMathews commented Dec 14, 2017

I'll work on a PR to do this.

@polarathene polarathene mentioned this pull request Mar 11, 2019
Merged
This was referenced Dec 7, 2021
Open
Open
Open
Open
Open
Open
Open
Open
@nidhi42 nidhi42 mentioned this pull request Nov 27, 2023
Open
This was referenced Nov 27, 2023
Open
Open
This was referenced Nov 28, 2023
Open
Open
Open
@philipedin philipedin mentioned this pull request Nov 28, 2023
Open
This was referenced Nov 28, 2023
Open
Open
Open
@tejzpr tejzpr mentioned this pull request Nov 29, 2023
Open
@nidhi42 nidhi42 mentioned this pull request Nov 30, 2023
Open
@Rutam21 Rutam21 mentioned this pull request Nov 30, 2023
Open
@monizb monizb mentioned this pull request Nov 30, 2023
Open
@impactyogi impactyogi mentioned this pull request Nov 30, 2023
Open
@monizb monizb mentioned this pull request Nov 30, 2023
Open
@saurabharch saurabharch mentioned this pull request Nov 30, 2023
Open
@Rutam21 Rutam21 mentioned this pull request Dec 1, 2023
Open
@monizb monizb mentioned this pull request Dec 1, 2023
Open
@joeawillis joeawillis mentioned this pull request Dec 1, 2023
Open
@nidhi42 nidhi42 mentioned this pull request Dec 1, 2023
Open
@saurabharch saurabharch mentioned this pull request Dec 1, 2023
Open
@ajesse11x ajesse11x mentioned this pull request Dec 1, 2023
Open
@wizbit wizbit mentioned this pull request Dec 1, 2023
Open
@ajesse11x ajesse11x mentioned this pull request Dec 1, 2023
Open
@MaxMood96 MaxMood96 mentioned this pull request Dec 1, 2023
Open
@ajesse11x ajesse11x mentioned this pull request Dec 1, 2023
Open
This was referenced Dec 2, 2023
Open
Open
raffishquartan pushed a commit to raffishquartan/gatsby that referenced this pull request Apr 28, 2026
@kripod @KyleAMathews
[gatsby-image] Support image loading with JavaScript disabled (gatsby…
7bc8632 
…js#3122)

* [gatsby-image] Support image loading with JavaScript disabled

* [gatsby-image] Fix noscript element rendering order

* Update index.js

* Fix my unfix
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

@KyleAMathews KyleAMathews

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@kripod @gatsbybot @KyleAMathews