Comments (11)
@jwang1919 so, I have learned some things:
filter
is not part of a stable CSS spec. It’s a W3C working draft- It’s not supported whatsoever by IE
- Only the most recent release of Chrome (end of August) started supporting it unprefixed
With that in mind, do you think Popcode should support it?
from popcode.
Yes because Cloud9 supports use of the filter
property.
EX: https://raw.githubusercontent.com/jwang1919/ScriptEdBasketball/master/screenshot.png
Ultimately if we're going to transition students from Popcode to Cloud9, any CSS valid in Cloud9 should be valid in Popcode. My thought is that (in our past experiences) some students like to prototype their code in JSBin before deploying to Cloud9. If we invalidate the filter
property in Popcode, students might assume it won't work in Cloud9.
Also filter
has some cool effects that might appeal to students especially if they decide to use Popcode in hackathons.
from popcode.
@jwang1919 But Cloud9 isn’t a learning tool—it’s just a coding environment. it also “supports” CSS properties like silliness
and marshmallows
, in the sense that it doesn’t complain if you use them, right? Ultimately students can use non-standard properties in Cloud9 as long as the browser they’re using supports them, but I think we need to figure out independently where Popcode should draw the line (for instance, I can guarantee lots of students at GWHS are using a version of Chrome that doesn’t support filter
).
from popcode.
Actually, I stand corrected that Cloud9 treats filter
and marshmallows
the same—it does pop up an “invalid property” warning for the latter.
My point remains, though, that depending on what laptop they use that day, students may still find that filter
does not work for them in Cloud9…
from popcode.
OK, giving it some more thought—the point of Popcode is to notify students of mistakes in their code. Using filter
isn’t a mistake—it might not work in some browsers, but it’s not a mistake. So, Popcode should support it.
from popcode.
@outoftime The point about the outdated Chrome versions does make sense. I would still argue in favor of filter
because it's more of a school IT issue than a Popcode issue. Also older versions of Chrome do support the -webkit-filter
property,
Also forgot to reply about not supported in IE. I don't think that'll be an issue, no one uses IE except corporate businesses/government with computers running XP.
Maybe we can reach a middle ground and add a warning saying something like "The CSS property 'filter' is an experimental property that might not work in some browsers", with a link to the caniuse.com of that property.
I also thought of a over engineered example where we can sniff the browser and run CSS validations based on what that browser can support (thinking like how Modernizr.js does it).
from popcode.
Or we can figure this out democratically with a vote among contributors as well as from ScriptEd volunteers.
from popcode.
Just to update since we moved back from Trello—the issue is band-aided, but ultimately we need to fix PrettyCSS
upstream to get real validations.
from popcode.
Sounds fun. What about the alternative of using another CSS linter?
from popcode.
@jwang1919 we would need to get rid of PrettyCSS entirely, and at this point I don’t know of another CSS linter that validates not just properties but values with respect to properties (e.g. it will tell you that color: 50%
is not valid even though width: 50%
is). I think for that reason it’s worth keeping around and worth contributing upstream (I already added Flexbox support, and it wasn’t too bad)
from popcode.
Already resolved this ticket! See PR #215
from popcode.
Related Issues (20)
- Support camera API in previews
- Cannot read property 'toString' of undefined HOT 4
- Cannot read property 'toString' of undefined HOT 1
- Bug: Popcode console is not updating with console.log or errors HOT 8
- User Feedback
- Can't log in with Google HOT 1
- Toggle multiline comments in editor with cmd-/ HOT 5
- User Feedback
- e.SHEBANG is not a function
- Add a “Beautify” button for users on iPad (which has no ctrl/cmmd key) HOT 12
- Backtick in CSS causes UI to crash HOT 1
- User Feedback
- The user denied permission to use Service Worker.
- HTML, CSS and JS Tabs (still) obscure first two lines HOT 1
- Page title bar overflows and has odd sizing behavior on small and/or zoomed screens HOT 1
- User Feedback
- <h1> within <p> causes following closing tags to turn red
- Add support for CSS property object-fit
- 401 unauthorized error when trying to export to Github from Popcode
- Diaeresis marks on international keyboards cause an error. A warning message might be more appropriate.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from popcode.